vite cannot load configuration from vite.config.js,
P粉510127741
P粉510127741 2023-10-26 15:36:15
0
2
637

I created a new vue application by doing these operations (according to vue documentation)

  1. npm init vue@latest
  2. npm install

Then I tried to runnpm run dev. And then this happened.

My environment is these

  • Operating System => Ubuntu
  • Node version => 18.7.0
  • npm version => 8.15.0

My package.json

{ "name": "vue-project", "version": "0.0.0", "scripts": { "dev": "vite", "build": "vite build", "preview": "vite preview --port 4173" }, "dependencies": { "vue": "^3.2.37" }, "devDependencies": { "@vitejs/plugin-vue": "^3.0.1", "vite": "^3.0.4" } }

My vite.config.js

import { fileURLToPath, URL } from 'node:url' import { defineConfig } from 'vite' import vue from '@vitejs/plugin-vue' // https://vitejs.dev/config/ export default defineConfig({ plugins: [vue()], resolve: { alias: { '@': fileURLToPath(new URL('./src', import.meta.url)) } } })

I've been searching for a while with no results. Thanks in advance.

P粉510127741
P粉510127741

reply all (2)
P粉998920744

I have the same problem here. It looks like the output is optimized for browser execution and modules such as "path, fs, etc." do not exist for the browser. This makes sense since it is part of Nodejs itself. It doesn't work in the browser. This is my assumption so far.

Look at the various solutions to understand why I made these assumptions.

https://github.com/vitejs/vite/discussions/6849https://github.com/vitejs/vite/issues/7821#issuecomment- 1142328698

https://github.com/marcofugaro/browserslist-to-esbuildhttps://esbuild.github.io/getting-started/

Given this information, I would prefer a simpler solution to prevent build failures using Vite as a bundler.

Configuration rollupOptions

I think the simplest solution is to define external.https://rollupjs.org/configuration-options/#external

import { resolve } from 'path'; import { defineConfig } from 'vite'; export default defineConfig({ plugins: [], build: { lib: { entry: resolve(__dirname, 'src/index.ts'), name: 'myLib', fileName: 'myLib', }, rollupOptions: { external: [/^node:\w+/], // <-- ignores all 'node:*' }, }, });
    P粉520204081

    Finally found a solution. The problem is caused bypackage.jsonfile conflict.Viteused an incorrectpackage.jsonfile located in the project's parent directory instead of the project's ownpackage.jsonfile. like this - p>

    • ~/package.json(wrong file)
    • ~/Projects/VueProject/package.json(correct file)

    So delete the wrong files and the problem will be solved.

    Thanks for the answer to this github questionpackage.json:1:0: Error: Unexpected end of file

      Latest Downloads
      More>
      Web Effects
      Website Source Code
      Website Materials
      Front End Template
      About us Disclaimer Sitemap
      php.cn:Public welfare online PHP training,Help PHP learners grow quickly!