search

vitejs / vite

Next generation frontend tooling. It's fast!
http://vite.dev
MIT License
68.99k stars 6.24k forks source link

vite.config.js - Cannot use import statement outside a module #4833

Closed rinodrummer closed 3 years ago

rinodrummer commented 3 years ago

Describe the bug

When I run npm run dev to run Vite, I always get the error:

SyntaxError: Cannot use import statement outside a module when loading vite.config.js.

Reproduction

I just installed Vite following the Installation guide and created an empty project to test it out, but without any improvement.

You can find my repo at rinodrummer/vite-test.

System Info

System:
    OS: Windows 10 10.0.18363
    CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
    Memory: 7.32 GB / 15.85 GB
  Binaries:
    Node: 16.8.0 - ~\.fnm\aliases\default\node.EXE
    npm: 6.10.1 - ~\node_modules\.bin\npm.CMD
  Browsers:
    Chrome: 92.0.4515.159
    Edge: Spartan (44.18362.1533.0)
    Internet Explorer: 11.0.18362.1
  npmPackages:
    @vitejs/plugin-vue: ^1.6.0 => 1.6.0
    vite: ^2.5.2 => 2.5.3

Used Package Manager

npm

Logs

failed to load config from C:\Users\rinodrummer\git\vite-test\vite.config.js
error when starting dev server:
D:\git\vite-test\vite.config.js:1
import { defineConfig } from 'vite'
^^^^^^

SyntaxError: Cannot use import statement outside a module
    at Object.compileFunction (node:vm:352:18)
    at wrapSafe (node:internal/modules/cjs/loader:1031:15)
    at Module._compile (node:internal/modules/cjs/loader:1065:27)
    at Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
    at Object.require.extensions.<computed> [as .js] (D:\git\vite-test\node_modules\vite\dist\node\chunks\dep-1be34a63.js:77164:13)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
    at require (node:internal/modules/cjs/helpers:94:18)
    at loadConfigFromBundledFile (D:\git\vite-test\node_modules\vite\dist\node\chunks\dep-1be34a63.js:77169:17)

Validations

Shinigami92 commented 3 years ago

Please try vite.config.ts or vite.config.mjs

rinodrummer commented 3 years ago

Please try vite.config.ts or vite.config.mjs

vite.config.mjs ``` vite:config native esm config loaded in 258ms URL { href: 'file:///C:/Users/rinodrummer/git/vite-test/vite.config.mjs', origin: 'null', protocol: 'file:', username: '', password: '', host: '', hostname: '', port: '', pathname: '/C:/Users/rinodrummer/git/vite-test/vite.config.mjs', search: '', searchParams: URLSearchParams {}, hash: '' } +0ms vite:config using resolved config: { vite:config plugins: [ vite:config 'vite:pre-alias', vite:config 'alias', vite:config 'vite:modulepreload-polyfill', vite:config 'vite:resolve', vite:config 'vite:html', vite:config 'vite:css', vite:config 'vite:esbuild', vite:config 'vite:json', vite:config 'vite:wasm', vite:config 'vite:worker', vite:config 'vite:asset', vite:config 'vite:vue', vite:config 'vite:define', vite:config 'vite:css-post', vite:config 'vite:client-inject', vite:config 'vite:import-analysis' vite:config ], vite:config server: { fs: { strict: undefined, allow: [Array] } }, vite:config define: { __VUE_OPTIONS_API__: true, __VUE_PROD_DEVTOOLS__: false }, vite:config ssr: { external: [ 'vue', '@vue/server-renderer' ] }, vite:config configFile: 'C:/Users/rinodrummer/git/vite-test/vite.config.mjs', vite:config configFileDependencies: [], vite:config inlineConfig: { vite:config root: undefined, vite:config base: undefined, vite:config mode: undefined, vite:config configFile: undefined, vite:config logLevel: undefined, vite:config clearScreen: undefined, vite:config server: { fs: [Object] } vite:config }, vite:config root: 'C:/Users/rinodrummer/git/vite-test', vite:config base: '/', vite:config resolve: { dedupe: undefined, alias: [ [Object], [Object] ] }, vite:config publicDir: 'C:\\Users\\rinodrummer\\git\\vite-test\\public', vite:config cacheDir: 'C:\\Users\\rinodrummer\\git\\vite-test\\node_modules\\.vite', vite:config command: 'serve', vite:config mode: 'development', vite:config isProduction: false, vite:config build: { vite:config target: [ 'es2019', 'edge88', 'firefox78', 'chrome87', 'safari13.1' ], vite:config polyfillModulePreload: true, vite:config outDir: 'dist', vite:config assetsDir: 'assets', vite:config assetsInlineLimit: 4096, vite:config cssCodeSplit: true, vite:config sourcemap: false, vite:config rollupOptions: {}, vite:config commonjsOptions: { include: [Array], extensions: [Array] }, vite:config dynamicImportVarsOptions: { warnOnError: true, exclude: [Array] }, vite:config minify: 'terser', vite:config terserOptions: {}, vite:config write: true, vite:config emptyOutDir: null, vite:config manifest: false, vite:config lib: false, vite:config ssr: false, vite:config ssrManifest: false, vite:config brotliSize: true, vite:config chunkSizeWarningLimit: 500, vite:config watch: null vite:config }, vite:config env: { BASE_URL: '/', MODE: 'development', DEV: true, PROD: false }, vite:config assetsInclude: [Function: assetsInclude], vite:config logger: { vite:config hasWarned: false, vite:config info: [Function: info], vite:config warn: [Function: warn], vite:config warnOnce: [Function: warnOnce], vite:config error: [Function: error], vite:config clearScreen: [Function: clearScreen], vite:config hasErrorLogged: [Function: hasErrorLogged] vite:config }, vite:config createResolver: [Function: createResolver], vite:config optimizeDeps: { esbuildOptions: { keepNames: undefined } } vite:config } +14ms vite:deps Crawling dependencies using entries: vite:deps C:/Users/rinodrummer/git/vite-test/index.html +0ms vite:resolve 1ms /src/main.js -> C:/Users/rinodrummer/git/vite-test/src/main.js +0ms vite:resolve 5ms vue -> D:/git/vite-test/node_modules/vue/dist/vue.runtime.esm-bundler.js +9ms vite:resolve 1ms ./App.vue -> C:/Users/rinodrummer/git/vite-test/src/App.vue +4ms vite:resolve 1ms ./components/HelloWorld.vue -> C:/Users/rinodrummer/git/vite-test/src/components/HelloWorld.vue +7ms vite:deps Scan completed in 102ms: { vue: 'D:/git/vite-test/node_modules/vue/dist/vue.runtime.esm-bundler.js' } +71ms Pre-bundling dependencies: vue (this will be run only when your dependencies or config have changed) > dep:vue:2:14: error: Could not resolve "./D:/git/vite-test/node_modules/vue/dist/vue.runtime.esm-bundler.js" 2 │ export * from "./D:/git/vite-test/node_modules/vue/dist/vue.runtime.esm-bundler.js" ╵ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ error when starting dev server: Error: Build failed with 1 error: dep:vue:2:14: error: Could not resolve "./D:/git/vite-test/node_modules/vue/dist/vue.runtime.esm-bundler.js" at failureErrorWithLog (D:\git\vite-test\node_modules\esbuild\lib\main.js:1451:15) at D:\git\vite-test\node_modules\esbuild\lib\main.js:1131:28 at runOnEndCallbacks (D:\git\vite-test\node_modules\esbuild\lib\main.js:921:63) at buildResponseToResult (D:\git\vite-test\node_modules\esbuild\lib\main.js:1129:7) at D:\git\vite-test\node_modules\esbuild\lib\main.js:1238:14 at D:\git\vite-test\node_modules\esbuild\lib\main.js:609:9 at handleIncomingPacket (D:\git\vite-test\node_modules\esbuild\lib\main.js:706:9) at Socket.readFromStdout (D:\git\vite-test\node_modules\esbuild\lib\main.js:576:7) at Socket.emit (node:events:394:28) at Socket.emit (node:domain:475:12) ```
vite.config.mjs ``` failed to load config from C:\Users\rinodrummer\git\vite-test\vite.config.ts error when starting dev server: TypeError: defaultLoader is not a function at Object.require.extensions. [as .ts] (D:\git\vite-test\node_modules\vite\dist\node\chunks\dep-1be34a63.js:77164:13) at Module.load (node:internal/modules/cjs/loader:981:32) at Function.Module._load (node:internal/modules/cjs/loader:822:12) at Module.require (node:internal/modules/cjs/loader:1005:19) at require (node:internal/modules/cjs/helpers:94:18) at loadConfigFromBundledFile (D:\git\vite-test\node_modules\vite\dist\node\chunks\dep-1be34a63.js:77169:17) at loadConfigFromFile (D:\git\vite-test\node_modules\vite\dist\node\chunks\dep-1be34a63.js:77088:32) at processTicksAndRejections (node:internal/process/task_queues:96:5) at async resolveConfig (D:\git\vite-test\node_modules\vite\dist\node\chunks\dep-1be34a63.js:76656:28) at async createServer (D:\git\vite-test\node_modules\vite\dist\node\chunks\dep-1be34a63.js:75179:20) ```

These are the errors I get when I rename the files like you asked.

haoqunjiang commented 3 years ago

Looks like it's a linked directory from another drive. That's not supported currently.

haoqunjiang commented 3 years ago

Same as https://github.com/vitejs/vite/issues/4302#issuecomment-882383044 and https://github.com/vitejs/vite/issues/4180