fix: always bundle config file, fix config hmr (#5779)

packages/playground/resolve/config-dep.js

@@ -0,0 +1,3 @@
+module.exports = {
+  a: 1
+}

packages/playground/resolve/vite.config.js

@@ -2,13 +2,17 @@ const virtualFile = '@virtual-file'
 const virtualId = '\0' + virtualFile
 
 const customVirtualFile = '@custom-virtual-file'
+const { a } = require('./config-dep');
 
 module.exports = {
   resolve: {
     extensions: ['.mjs', '.js', '.es', '.ts'],
     mainFields: ['custom', 'module'],
     conditions: ['custom']
   },
+  define: {
+    VITE_CONFIG_DEP_TEST: a
+  },
   plugins: [
     {
       name: 'virtual-module',

packages/vite/src/node/config.ts

@@ -829,13 +829,13 @@ export async function loadConfigFromFile(
 
     if (isESM) {
       const fileUrl = require('url').pathToFileURL(resolvedPath)
+      const bundled = await bundleConfigFile(resolvedPath, true)
+      dependencies = bundled.dependencies
       if (isTS) {
         // before we can register loaders without requiring users to run node
         // with --experimental-loader themselves, we have to do a hack here:
         // bundle the config file w/ ts transforms first, write it to disk,
         // load it with native Node ESM, then delete the file.
-        const bundled = await bundleConfigFile(resolvedPath, true)
-        dependencies = bundled.dependencies
         fs.writeFileSync(resolvedPath + '.js', bundled.code)
         userConfig = (await dynamicImport(`${fileUrl}.js?t=${Date.now()}`))
           .default
@@ -850,34 +850,8 @@ export async function loadConfigFromFile(
       }
     }
 
-    if (!isTS && !isESM) {
-      // 1. try to directly require the module (assuming commonjs)
-      try {
-        // clear cache in case of server restart
-        delete require.cache[require.resolve(resolvedPath)]
-        userConfig = require(resolvedPath)
-        debug(`cjs config loaded in ${getTime()}`)
-      } catch (e) {
-        const ignored = new RegExp(
-          [
-            `Cannot use import statement`,
-            `Must use import to load ES Module`,
-            // #1635, #2050 some Node 12.x versions don't have esm detection
-            // so it throws normal syntax errors when encountering esm syntax
-            `Unexpected token`,
-            `Unexpected identifier`
-          ].join('|')
-        )
-        if (!ignored.test(e.message)) {
-          throw e
-        }
-      }
-    }
-
     if (!userConfig) {
-      // 2. if we reach here, the file is ts or using es import syntax, or
-      // the user has type: "module" in their package.json (#917)
-      // transpile es import syntax to require syntax using esbuild.
+      // Bundle config file and transpile it to cjs using esbuild.
       const bundled = await bundleConfigFile(resolvedPath)
       dependencies = bundled.dependencies
       userConfig = await loadConfigFromBundledFile(resolvedPath, bundled.code)