当我的vue环境什么的都搭好的时候,最后一步npm run dev 问题就来了,我修改一下index.js。端口8080修改成其他8099 还是报错,后面也是查一下资料搞好久才解决掉的,后面我把Browserlist相关的文件删除了,重新启动一下npm run dev才成功的,希望给学习vue的同学在适配环境能够更好解决掉。

 

E:\world\vue-demo>npm run dev

> vue-demo@1.0.0 dev E:\world\vue-demo
> webpack-dev-server --inline --progress --config build/webpack.dev.conf.js

 14% building modules 41/44 modules 3 active ...\vue-style-loader\lib\listToStyles.js{ BrowserslistError: E:\world\vue-demo contains both browserslist and package.json with browsers
    at E:\world\vue-demo\node_modules\browserslist\node.js:189:15
    at eachParent (E:\world\vue-demo\node_modules\browserslist\node.js:43:18)
    at Object.findConfig (E:\world\vue-demo\node_modules\browserslist\node.js:172:20)
    at Object.loadConfig (E:\world\vue-demo\node_modules\browserslist\node.js:126:37)
    at browserslist (E:\world\vue-demo\node_modules\browserslist\index.js:194:22)
    at Browsers.parse (E:\world\vue-demo\node_modules\autoprefixer\lib\browsers.js:61:16)
    at new Browsers (E:\world\vue-demo\node_modules\autoprefixer\lib\browsers.js:52:30)
    at loadPrefixes (E:\world\vue-demo\node_modules\autoprefixer\lib\autoprefixer.js:70:24)
    at plugin (E:\world\vue-demo\node_modules\autoprefixer\lib\autoprefixer.js:81:24)
    at LazyResult.run (E:\world\vue-demo\node_modules\postcss\lib\lazy-result.js:277:20)
    at LazyResult.asyncTick (E:\world\vue-demo\node_modules\postcss\lib\lazy-result.js:192:32)
    at LazyResult.asyncTick (E:\world\vue-demo\node_modules\postcss\lib\lazy-result.js:204:22)
    at E:\world\vue-demo\node_modules\postcss\lib\lazy-result.js:197:27
    at <anonymous>
  name: 'BrowserslistError',
  message: 'E:\\world\\vue-demo contains both browserslist and package.json with browsers',
  browserslist: true }
 15% building modules 42/44 modules 2 active ...\vue-style-loader\lib\listToStyles.js{ BrowserslistError: E:\world\vue-demo contains both browserslist and package.json with browsers
    at E:\world\vue-demo\node_modules\browserslist\node.js:189:15
    at eachParent (E:\world\vue-demo\node_modules\browserslist\node.js:43:18)
    at Object.findConfig (E:\world\vue-demo\node_modules\browserslist\node.js:172:20)
    at Object.loadConfig (E:\world\vue-demo\node_modules\browserslist\node.js:126:37)
    at browserslist (E:\world\vue-demo\node_modules\browserslist\index.js:194:22)
    at Browsers.parse (E:\world\vue-demo\node_modules\autoprefixer\lib\browsers.js:61:16)
    at new Browsers (E:\world\vue-demo\node_modules\autoprefixer\lib\browsers.js:52:30)
    at loadPrefixes (E:\world\vue-demo\node_modules\autoprefixer\lib\autoprefixer.js:70:24)
    at plugin (E:\world\vue-demo\node_modules\autoprefixer\lib\autoprefixer.js:81:24)
    at LazyResult.run (E:\world\vue-demo\node_modules\postcss\lib\lazy-result.js:277:20)
    at LazyResult.asyncTick (E:\world\vue-demo\node_modules\postcss\lib\lazy-result.js:192:32)
    at LazyResult.asyncTick (E:\world\vue-demo\node_modules\postcss\lib\lazy-result.js:204:22)
    at E:\world\vue-demo\node_modules\postcss\lib\lazy-result.js:197:27
    at <anonymous>
  name: 'BrowserslistError',
  message: 'E:\\world\\vue-demo contains both browserslist and package.json with browsers',
  browserslist: true }
 94% asset optimization

     ERROR  Failed to compile with 2 errors                                          11:45:05

 error  in ./src/App.vue

Module build failed: BrowserslistError: E:\world\vue-demo contains both browserslist and
package.json with browsers
    at E:\world\vue-demo\node_modules\browserslist\node.js:189:15
    at eachParent (E:\world\vue-demo\node_modules\browserslist\node.js:43:18)
    at Object.findConfig (E:\world\vue-demo\node_modules\browserslist\node.js:172:20)
    at Object.loadConfig (E:\world\vue-demo\node_modules\browserslist\node.js:126:37)
    at browserslist (E:\world\vue-demo\node_modules\browserslist\index.js:194:22)
    at Browsers.parse (E:\world\vue-demo\node_modules\autoprefixer\lib\browsers.js:61:16)
    at new Browsers (E:\world\vue-demo\node_modules\autoprefixer\lib\browsers.js:52:30)
    at loadPrefixes (E:\world\vue-demo\node_modules\autoprefixer\lib\autoprefixer.js:70:24)
    at plugin (E:\world\vue-demo\node_modules\autoprefixer\lib\autoprefixer.js:81:24)
    at LazyResult.run (E:\world\vue-demo\node_modules\postcss\lib\lazy-result.js:277:20)
    at LazyResult.asyncTick (E:\world\vue-demo\node_modules\postcss\lib\lazy-result.js:192:32)
    at LazyResult.asyncTick (E:\world\vue-demo\node_modules\postcss\lib\lazy-result.js:204:22)
    at E:\world\vue-demo\node_modules\postcss\lib\lazy-result.js:197:27
    at <anonymous>

 @ ./node_modules/vue-style-loader!./node_modules/css-loader?{"sourceMap":true}!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-7ba5bd90","scoped":false,"hasInlineConfig":false}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./src/App.vue 4:14-296 13:3-17:5 14:22-304
 @ ./src/App.vue
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://localhost:8099 webpack/hot/dev-server ./src/main.js

 error  in ./src/components/HelloWorld.vue

Module build failed: BrowserslistError: E:\world\vue-demo contains both browserslist and
package.json with browsers
    at E:\world\vue-demo\node_modules\browserslist\node.js:189:15
    at eachParent (E:\world\vue-demo\node_modules\browserslist\node.js:43:18)
    at Object.findConfig (E:\world\vue-demo\node_modules\browserslist\node.js:172:20)
    at Object.loadConfig (E:\world\vue-demo\node_modules\browserslist\node.js:126:37)
    at browserslist (E:\world\vue-demo\node_modules\browserslist\index.js:194:22)
    at Browsers.parse (E:\world\vue-demo\node_modules\autoprefixer\lib\browsers.js:61:16)
    at new Browsers (E:\world\vue-demo\node_modules\autoprefixer\lib\browsers.js:52:30)
    at loadPrefixes (E:\world\vue-demo\node_modules\autoprefixer\lib\autoprefixer.js:70:24)
    at plugin (E:\world\vue-demo\node_modules\autoprefixer\lib\autoprefixer.js:81:24)
    at LazyResult.run (E:\world\vue-demo\node_modules\postcss\lib\lazy-result.js:277:20)
    at LazyResult.asyncTick (E:\world\vue-demo\node_modules\postcss\lib\lazy-result.js:192:32)
    at LazyResult.asyncTick (E:\world\vue-demo\node_modules\postcss\lib\lazy-result.js:204:22)
    at E:\world\vue-demo\node_modules\postcss\lib\lazy-result.js:197:27
    at <anonymous>

 @ ./node_modules/vue-style-loader!./node_modules/css-loader?{"sourceMap":true}!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-469af010","scoped":true,"hasInlineConfig":false}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./src/components/HelloWorld.vue 4:14-311 13:3-17:5 14:22-319
 @ ./src/components/HelloWorld.vue
 @ ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./src/App.vue
 @ ./src/App.vue
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://localhost:8099 webpack/hot/dev-server ./src/main.js

 

 

应该是browsercraigslist的相关文件跟package,json不能同时存在的意识罢.,望大神经过帮忙修正,..

所以然后尝试把browsercraigslist相关文件删了,运行npm run dev

很高兴也把问题解决,希望给更多的人把问题给解决掉

可以关注我公众号

Logo

前往低代码交流专区

更多推荐