diff --git a/.changeset/four-suns-happen.md b/.changeset/four-suns-happen.md
new file mode 100644
index 000000000..88bb8bc7e
--- /dev/null
+++ b/.changeset/four-suns-happen.md
@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Fix: import.meta.env.BASE_URL will be '/' in client loaded component on dev mode
diff --git a/packages/astro/e2e/astro-envs.test.js b/packages/astro/e2e/astro-envs.test.js
new file mode 100644
index 000000000..b80a4fc5f
--- /dev/null
+++ b/packages/astro/e2e/astro-envs.test.js
@@ -0,0 +1,26 @@
+import { expect } from '@playwright/test';
+import { testFactory } from './test-utils.js';
+
+const test = testFactory({ root: './fixtures/astro-envs/' });
+
+let devServer;
+
+test.beforeAll(async ({ astro }) => {
+ devServer = await astro.startDevServer();
+});
+
+test.afterAll(async () => {
+ await devServer.stop();
+});
+
+test.describe('Astro Environment BASE_URL', () => {
+ test('BASE_URL', async ({ page, astro }) => {
+ await page.goto(astro.resolveUrl('/blog/'));
+
+ const astroBaseUrl = page.locator('id=astro-base-url');
+ await expect(astroBaseUrl, 'astroBaseUrl equals to /blog/').toHaveText('/blog/')
+
+ const clientComponentBaseUrl = page.locator('id=client-component-base-url');
+ await expect(clientComponentBaseUrl, 'clientComponentBaseUrl equals to /blog').toHaveText('/blog/')
+ });
+});
diff --git a/packages/astro/e2e/fixtures/astro-envs/.gitignore b/packages/astro/e2e/fixtures/astro-envs/.gitignore
new file mode 100644
index 000000000..8e0776e8d
--- /dev/null
+++ b/packages/astro/e2e/fixtures/astro-envs/.gitignore
@@ -0,0 +1 @@
+!.env
diff --git a/packages/astro/e2e/fixtures/astro-envs/astro.config.mjs b/packages/astro/e2e/fixtures/astro-envs/astro.config.mjs
new file mode 100644
index 000000000..1fee9eb36
--- /dev/null
+++ b/packages/astro/e2e/fixtures/astro-envs/astro.config.mjs
@@ -0,0 +1,9 @@
+import { defineConfig } from 'astro/config';
+import vue from '@astrojs/vue';
+
+// https://astro.build/config
+export default defineConfig({
+ site: 'http://example.com',
+ base: '/blog',
+ integrations: [vue()],
+});
diff --git a/packages/astro/e2e/fixtures/astro-envs/package.json b/packages/astro/e2e/fixtures/astro-envs/package.json
new file mode 100644
index 000000000..4309d0833
--- /dev/null
+++ b/packages/astro/e2e/fixtures/astro-envs/package.json
@@ -0,0 +1,9 @@
+{
+ "name": "@test/astro-envs",
+ "version": "0.0.0",
+ "private": true,
+ "dependencies": {
+ "@astrojs/vue": "workspace:*",
+ "astro": "workspace:*"
+ }
+}
diff --git a/packages/astro/e2e/fixtures/astro-envs/src/components/Client.vue b/packages/astro/e2e/fixtures/astro-envs/src/components/Client.vue
new file mode 100644
index 000000000..9e821c6c2
--- /dev/null
+++ b/packages/astro/e2e/fixtures/astro-envs/src/components/Client.vue
@@ -0,0 +1,13 @@
+
+