refactor(playground): move to ESM module and add type check for config

playground/alias/vite.config.js

@@ -1,9 +1,7 @@
-const path = require('node:path')
+import path from 'node:path'
+import { defineConfig } from 'vite'
 
-/**
- * @type {import('vite').UserConfig}
- */
-module.exports = {
+export default defineConfig({
   resolve: {
     alias: [
       { find: 'fs', replacement: path.resolve(__dirname, 'test.js') },
@@ -39,4 +37,4 @@ module.exports = {
     __VUE_OPTIONS_API__: true,
     __VUE_PROD_DEVTOOLS__: true,
   },
-}
+})

playground/assets-sanitize/vite.config.js

@@ -1,6 +1,6 @@
-const { defineConfig } = require('vite')
+import { defineConfig } from 'vite'
 
-module.exports = defineConfig({
+export default defineConfig({
   build: {
     //speed up build
     minify: false,

playground/assets/__tests__/relative-base/vite.config.js

@@ -1 +1 @@
-module.exports = require('../../vite.config-relative-base')
+export { default } from '../../vite.config-relative-base'

playground/assets/__tests__/runtime-base/vite.config.js

@@ -1 +1 @@
-module.exports = require('../../vite.config-runtime-base')
+export { default } from '../../vite.config-runtime-base'

playground/assets/vite.config-relative-base.js

@@ -1,15 +1,13 @@
-/**
- * @type {import('vite').UserConfig}
- */
+import { defineConfig } from 'vite'
+import baseConfig from './vite.config.js'
 
-const baseConfig = require('./vite.config.js')
-module.exports = {
+export default defineConfig({
   ...baseConfig,
   base: './', // relative base to make dist portable
   build: {
     ...baseConfig.build,
     outDir: 'dist/relative-base',
-    watch: false,
+    watch: null,
     minify: false,
     assetsInlineLimit: 0,
     rollupOptions: {
@@ -23,4 +21,4 @@ module.exports = {
   testConfig: {
     baseRoute: '/relative-base/',
   },
-}
+})

playground/assets/vite.config-runtime-base.js

@@ -1,22 +1,18 @@
-const path = require('node:path')
+import { defineConfig } from 'vite'
+import baseConfig from './vite.config.js'
 
 const dynamicBaseAssetsCode = `
 globalThis.__toAssetUrl = url => '/' + url
 globalThis.__publicBase = '/'
 `
 
-const baseConfig = require('./vite.config.js')
-
-/**
- * @type {import('vite').UserConfig}
- */
-module.exports = {
+export default defineConfig({
   ...baseConfig,
   base: './', // overwrite the original base: '/foo/'
   build: {
     ...baseConfig.build,
     outDir: 'dist',
-    watch: false,
+    watch: null,
     minify: false,
     assetsInlineLimit: 0,
     rollupOptions: {
@@ -61,4 +57,4 @@ module.exports = {
       }
     },
   },
-}
+})

playground/assets/vite.config.js

@@ -1,9 +1,9 @@
-const path = require('node:path')
+import path from 'node:path'
+import { defineConfig } from 'vite'
 
-/**
- * @type {import('vite').UserConfig}
- */
-module.exports = {
+/** @type {import('vite').UserConfig} */
+// @ts-expect-error typecast
+export default defineConfig({
   base: '/foo',
   publicDir: 'static',
   resolve: {
@@ -18,4 +18,4 @@ module.exports = {
     manifest: true,
     watch: {},
   },
-}
+})

playground/backend-integration/vite.config.js

@@ -1,6 +1,6 @@
-const path = require('node:path')
-const glob = require('fast-glob')
-const normalizePath = require('vite').normalizePath
+import path from 'node:path'
+import glob from 'fast-glob'
+import { defineConfig, normalizePath } from 'vite'
 
 /**
  * @returns {import('vite').Plugin}
@@ -40,10 +40,7 @@ function BackendIntegrationExample() {
   }
 }
 
-/**
- * @returns {import('vite').UserConfig}
- */
-module.exports = {
+export default defineConfig({
   base: '/dev/',
   plugins: [BackendIntegrationExample()],
-}
+})

playground/cli/vite.config.js

@@ -1,6 +1,6 @@
-const { defineConfig } = require('vite')
+import { defineConfig } from 'vite'
 
-module.exports = defineConfig({
+export default defineConfig({
   server: {
     host: 'localhost',
     headers: {

playground/css-codesplit-cjs/vite.config.js

@@ -1,6 +1,7 @@
-const { resolve } = require('node:path')
+import { resolve } from 'node:path'
+import { defineConfig } from 'vite'
 
-module.exports = {
+export default defineConfig({
   build: {
     outDir: './dist',
     manifest: true,
@@ -17,4 +18,4 @@ module.exports = {
       },
     },
   },
-}
+})

playground/css-codesplit/vite.config.js

@@ -1,6 +1,7 @@
-const { resolve } = require('node:path')
+import { resolve } from 'node:path'
+import { defineConfig } from 'vite'
 
-module.exports = {
+export default defineConfig({
   build: {
     manifest: true,
     rollupOptions: {
@@ -18,4 +19,4 @@ module.exports = {
       },
     },
   },
-}
+})

playground/css-sourcemap/vite.config.js

@@ -1,9 +1,7 @@
-const MagicString = require('magic-string')
+import { defineConfig } from 'vite'
+import MagicString from 'magic-string'
 
-/**
- * @type {import('vite').UserConfig}
- */
-module.exports = {
+export default defineConfig({
   resolve: {
     alias: {
       '@': __dirname,
@@ -58,4 +56,4 @@ module.exports = {
       },
     },
   ],
-}
+})

playground/css/vite.config-relative-base.js

@@ -1,15 +1,13 @@
-/**
- * @type {import('vite').UserConfig}
- */
+import { defineConfig } from 'vite'
+import baseConfig from './vite.config.js'
 
-const baseConfig = require('./vite.config.js')
-module.exports = {
+export default defineConfig({
   ...baseConfig,
   base: './', // relative base to make dist portable
   build: {
     ...baseConfig.build,
     outDir: 'dist/relative-base',
-    watch: false,
+    watch: null,
     minify: false,
     assetsInlineLimit: 0,
     rollupOptions: {
@@ -23,4 +21,4 @@ module.exports = {
   testConfig: {
     baseRoute: '/relative-base/',
   },
-}
+})

playground/css/vite.config.js

@@ -1,14 +1,16 @@
-const path = require('node:path')
+import path from 'node:path'
+import { defineConfig } from 'vite'
 
 // trigger scss bug: https://github.com/sass/dart-sass/issues/710
 // make sure Vite handles safely
+// @ts-expect-error refer to https://github.com/vitejs/vite/pull/11079
 globalThis.window = {}
+// @ts-expect-error refer to https://github.com/vitejs/vite/pull/11079
 globalThis.location = new URL('http://localhost/')
 
-/**
- * @type {import('vite').UserConfig}
- */
-module.exports = {
+/** @type {import('vite').UserConfig} */
+// @ts-expect-error typecast
+export default defineConfig({
   build: {
     cssTarget: 'chrome61',
   },
@@ -69,4 +71,4 @@ module.exports = {
       },
     },
   },
-}
+})

playground/define/vite.config.js

@@ -1,4 +1,8 @@
-module.exports = {
+import { defineConfig } from 'vite'
+
+/** @type {import('vite').UserConfig} */
+// @ts-expect-error typecast
+export default defineConfig({
   define: {
     __EXP__: 'false',
     __STRING__: '"hello"',
@@ -22,4 +26,4 @@ module.exports = {
     __VAR_NAME__: false,
     __STRINGIFIED_OBJ__: JSON.stringify({ foo: true }),
   },
-}
+})

playground/dynamic-import/vite.config.js

@@ -1,8 +1,8 @@
-const fs = require('node:fs')
-const path = require('node:path')
-const vite = require('vite')
+import fs from 'node:fs'
+import path from 'node:path'
+import vite from 'vite'
 
-module.exports = vite.defineConfig({
+export default vite.defineConfig({
   plugins: [
     {
       name: 'copy',

playground/env-nested/vite.config.js

@@ -1,5 +1,5 @@
-const { defineConfig } = require('vite')
+import { defineConfig } from 'vite'
 
-module.exports = defineConfig({
+export default defineConfig({
   envDir: './envs',
 })

playground/env/vite.config.js

@@ -1,8 +1,8 @@
-const { defineConfig } = require('vite')
+import { defineConfig } from 'vite'
 
 process.env.EXPAND = 'expand'
 
-module.exports = defineConfig({
+export default defineConfig({
   base: '/env/',
   envPrefix: ['VITE_', 'CUSTOM_PREFIX_'],
   build: {

playground/extensions/vite.config.js

@@ -1,6 +1,8 @@
-module.exports = {
+import { defineConfig } from 'vite'
+
+export default defineConfig({
   resolve: {
     alias: [{ find: 'vue', replacement: 'vue/dist/vue.esm-bundler.js' }],
     extensions: ['.js'],
   },
-}
+})

playground/fs-serve/root/vite.config.js

@@ -1,9 +1,7 @@
-const path = require('node:path')
+import path from 'node:path'
+import { defineConfig } from 'vite'
 
-/**
- * @type {import('vite').UserConfig}
- */
-module.exports = {
+export default defineConfig({
   build: {
     rollupOptions: {
       input: {
@@ -31,4 +29,4 @@ module.exports = {
   define: {
     ROOT: JSON.stringify(path.dirname(__dirname).replace(/\\/g, '/')),
   },
-}
+})

playground/hmr/optional-chaining/parent.js

@@ -1,3 +1,5 @@
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-ignore
 import { foo } from './child'
 
 import.meta.hot?.accept('./child', ({ foo }) => {

playground/html/vite.config.js

@@ -1,9 +1,7 @@
-const { resolve } = require('node:path')
+import { resolve } from 'node:path'
+import { defineConfig } from 'vite'
 
-/**
- * @type {import('vite').UserConfig}
- */
-module.exports = {
+export default defineConfig({
   base: './',
   build: {
     rollupOptions: {
@@ -189,4 +187,4 @@ ${
       },
     },
   ],
-}
+})

playground/js-sourcemap/vite.config.js

@@ -1,8 +1,7 @@
-/**
- * @type {import('vite').UserConfig}
- */
-module.exports = {
+import { defineConfig } from 'vite'
+
+export default defineConfig({
   build: {
     sourcemap: true,
   },
-}
+})

playground/legacy/vite.config-custom-filename.js

@@ -1,6 +1,7 @@
-const legacy = require('@vitejs/plugin-legacy').default
+import { defineConfig } from 'vite'
+import legacy from '@vitejs/plugin-legacy'
 
-module.exports = {
+export default defineConfig({
   plugins: [legacy({ modernPolyfills: true })],
   build: {
     manifest: true,
@@ -12,4 +13,4 @@ module.exports = {
       },
     },
   },
-}
+})

playground/legacy/vite.config-multiple-output.js

@@ -1,5 +1,5 @@
-import legacy from '@vitejs/plugin-legacy'
 import { defineConfig } from 'vite'
+import legacy from '@vitejs/plugin-legacy'
 
 export default defineConfig({
   plugins: [legacy({ modernPolyfills: true })],