diff --git a/playground/assets/__tests__/url-base/vite.config.js b/playground/assets/__tests__/url-base/vite.config.js
index b096ea1d30caad..4ad6a7066edad3 100644
--- a/playground/assets/__tests__/url-base/vite.config.js
+++ b/playground/assets/__tests__/url-base/vite.config.js
@@ -1 +1 @@
-module.exports = require('../../vite.config-url-base')
+export { default } from '../../vite.config-url-base'
diff --git a/playground/assets/vite.config-url-base.js b/playground/assets/vite.config-url-base.js
index 3632526fc3c21a..bed30f8d1b2e73 100644
--- a/playground/assets/vite.config-url-base.js
+++ b/playground/assets/vite.config-url-base.js
@@ -1,17 +1,13 @@
-/**
- * @type {import('vite').UserConfig}
- */
+import { defineConfig } from 'vite'
+import baseConfig from './vite.config.js'
 
-const { DEFAULT_PREVIEW_PORT } = require('vite')
-
-const baseConfig = require('./vite.config.js')
-module.exports = {
+export default defineConfig({
   ...baseConfig,
   base: 'http://localhost:4173/',
   build: {
     ...baseConfig.build,
     outDir: 'dist/url-base',
-    watch: false,
+    watch: null,
     minify: false,
     assetsInlineLimit: 0,
     rollupOptions: {
@@ -25,4 +21,4 @@ module.exports = {
   testConfig: {
     baseRoute: '/url-base/',
   },
-}
+})