最近想尝试一下用vue,js来做一个app。。。没错,小菜鸡的我记录这个大蠢bug.
当我的vue环境什么的都搭好的时候,最后一步npm run dev 问题就来了
Microsoft Windows [版本 10.0.16299.431]
(c) 2017 Microsoft Corporation。保留所有权利。
C:\Users\ASUS>cd F:\WEB\HBuilder\app
C:\Users\ASUS>f:
F:\WEB\HBuilder\app> cd travelApp
F:\WEB\HBuilder\app\travelApp>npm run dev
> [email protected] dev F:\WEB\HBuilder\app\travelApp
> webpack-dev-server --inline --progress --config build/webpack.dev.conf.js
15% building modules 42/45 modules 3 active ...der\app\travelApp\src\assets\logo.png{ BrowserslistError: F:\WEB\HBuilder\app\travelApp contains both browserslist and package.json with browsers
at F:\WEB\HBuilder\app\travelApp\node_modules\browserslist\node.js:189:15
at eachParent (F:\WEB\HBuilder\app\travelApp\node_modules\browserslist\node.js:43:18)
at Object.findConfig (F:\WEB\HBuilder\app\travelApp\node_modules\browserslist\node.js:172:20)
at Object.loadConfig (F:\WEB\HBuilder\app\travelApp\node_modules\browserslist\node.js:126:37)
at browserslist (F:\WEB\HBuilder\app\travelApp\node_modules\browserslist\index.js:194:22)
at Browsers.parse (F:\WEB\HBuilder\app\travelApp\node_modules\autoprefixer\lib\browsers.js:61:16)
at new Browsers (F:\WEB\HBuilder\app\travelApp\node_modules\autoprefixer\lib\browsers.js:52:30)
at loadPrefixes (F:\WEB\HBuilder\app\travelApp\node_modules\autoprefixer\lib\autoprefixer.js:70:24)
at plugin (F:\WEB\HBuilder\app\travelApp\node_modules\autoprefixer\lib\autoprefixer.js:81:24)
at LazyResult.run (F:\WEB\HBuilder\app\travelApp\node_modules\postcss\lib\lazy-result.js:277:20)
at LazyResult.asyncTick (F:\WEB\HBuilder\app\travelApp\node_modules\postcss\lib\lazy-result.js:192:32)
at LazyResult.asyncTick (F:\WEB\HBuilder\app\travelApp\node_modules\postcss\lib\lazy-result.js:204:22)
at F:\WEB\HBuilder\app\travelApp\node_modules\postcss\lib\lazy-result.js:197:27
name: 'BrowserslistError',
message:
'F:\\WEB\\HBuilder\\app\\travelApp contains both browserslist and package.json with browsers',
browserslist: true } 15% building modules 43/45 modules 2 active ...der\app\travelApp\src\assets\logo.png{ BrowserslistError: F:\WEB\HBuilder\app\travelApp contains both browserslist and package.json with browsers
at F:\WEB\HBuilder\app\travelApp\node_modules\browserslist\node.js:189:15
at eachParent (F:\WEB\HBuilder\app\travelApp\node_modules\browserslist\node.js:43:18)
at Object.findConfig (F:\WEB\HBuilder\app\travelApp\node_modules\browserslist\node.js:172:20)
at Object.loadConfig (F:\WEB\HBuilder\app\travelApp\node_modules\browserslist\node.js:126:37)
at browserslist (F:\WEB\HBuilder\app\travelApp\node_modules\browserslist\index.js:194:22)
at Browsers.parse (F:\WEB\HBuilder\app\travelApp\node_modules\autoprefixer\lib\browsers.js:61:16)
at new Browsers (F:\WEB\HBuilder\app\travelApp\node_modules\autoprefixer\lib\browsers.js:52:30)
at loadPrefixes (F:\WEB\HBuilder\app\travelApp\node_modules\autoprefixer\lib\autoprefixer.js:70:24)
at plugin (F:\WEB\HBuilder\app\travelApp\node_modules\autoprefixer\lib\autoprefixer.js:81:24)
at LazyResult.run (F:\WEB\HBuilder\app\travelApp\node_modules\postcss\lib\lazy-result.js:277:20)
at LazyResult.asyncTick (F:\WEB\HBuilder\app\travelApp\node_modules\postcss\lib\lazy-result.js:192:32)
at LazyResult.asyncTick (F:\WEB\HBuilder\app\travelApp\node_modules\postcss\lib\lazy-result.js:204:22)
at F:\WEB\HBuilder\app\travelApp\node_modules\postcss\lib\lazy-result.js:197:27
name: 'BrowserslistError',
message:
'F:\\WEB\\HBuilder\\app\\travelApp contains both browserslist and package.json with browsers',
browserslist: true } 94% asset optimization
ERROR Failed to compile with 2 errors 00:21:38
error in ./src/App.vue
Module build failed: BrowserslistError: F:\WEB\HBuilder\app\travelApp contains both browserslist and package.json with browsers
at F:\WEB\HBuilder\app\travelApp\node_modules\browserslist\node.js:189:15
at eachParent (F:\WEB\HBuilder\app\travelApp\node_modules\browserslist\node.js:43:18)
at Object.findConfig (F:\WEB\HBuilder\app\travelApp\node_modules\browserslist\node.js:172:20)
at Object.loadConfig (F:\WEB\HBuilder\app\travelApp\node_modules\browserslist\node.js:126:37)
at browserslist (F:\WEB\HBuilder\app\travelApp\node_modules\browserslist\index.js:194:22)
at Browsers.parse (F:\WEB\HBuilder\app\travelApp\node_modules\autoprefixer\lib\browsers.js:61:16)
at new Browsers (F:\WEB\HBuilder\app\travelApp\node_modules\autoprefixer\lib\browsers.js:52:30)
at loadPrefixes (F:\WEB\HBuilder\app\travelApp\node_modules\autoprefixer\lib\autoprefixer.js:70:24)
at plugin (F:\WEB\HBuilder\app\travelApp\node_modules\autoprefixer\lib\autoprefixer.js:81:24)
at LazyResult.run (F:\WEB\HBuilder\app\travelApp\node_modules\postcss\lib\lazy-result.js:277:20)
at LazyResult.asyncTick (F:\WEB\HBuilder\app\travelApp\node_modules\postcss\lib\lazy-result.js:192:32)
at LazyResult.asyncTick (F:\WEB\HBuilder\app\travelApp\node_modules\postcss\lib\lazy-result.js:204:22)
at F:\WEB\HBuilder\app\travelApp\node_modules\postcss\lib\lazy-result.js:197:27
@ ./node_modules/vue-style-loader!./node_modules/css-loader?{"sourceMap":true}!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-04c2046b","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:8080 webpack/hot/dev-server ./src/main.js
error in ./src/components/HelloWorld.vue
Module build failed: BrowserslistError: F:\WEB\HBuilder\app\travelApp contains both browserslist and package.json with browsers
at F:\WEB\HBuilder\app\travelApp\node_modules\browserslist\node.js:189:15
at eachParent (F:\WEB\HBuilder\app\travelApp\node_modules\browserslist\node.js:43:18)
at Object.findConfig (F:\WEB\HBuilder\app\travelApp\node_modules\browserslist\node.js:172:20)
at Object.loadConfig (F:\WEB\HBuilder\app\travelApp\node_modules\browserslist\node.js:126:37)
at browserslist (F:\WEB\HBuilder\app\travelApp\node_modules\browserslist\index.js:194:22)
at Browsers.parse (F:\WEB\HBuilder\app\travelApp\node_modules\autoprefixer\lib\browsers.js:61:16)
at new Browsers (F:\WEB\HBuilder\app\travelApp\node_modules\autoprefixer\lib\browsers.js:52:30)
at loadPrefixes (F:\WEB\HBuilder\app\travelApp\node_modules\autoprefixer\lib\autoprefixer.js:70:24)
at plugin (F:\WEB\HBuilder\app\travelApp\node_modules\autoprefixer\lib\autoprefixer.js:81:24)
at LazyResult.run (F:\WEB\HBuilder\app\travelApp\node_modules\postcss\lib\lazy-result.js:277:20)
at LazyResult.asyncTick (F:\WEB\HBuilder\app\travelApp\node_modules\postcss\lib\lazy-result.js:192:32)
at LazyResult.asyncTick (F:\WEB\HBuilder\app\travelApp\node_modules\postcss\lib\lazy-result.js:204:22)
at F:\WEB\HBuilder\app\travelApp\node_modules\postcss\lib\lazy-result.js:197:27
@ ./node_modules/vue-style-loader!./node_modules/css-loader?{"sourceMap":true}!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-656039f0","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
@ ./src/router/index.js
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/main.js
这是网上的一个解决方法
是prettier模块导致的报错,查了下发现In prettier 1.13.0, default parser was removed with a minor version(used to be babylon), this breaks the formatter here.意思是在prettier的 1.13.0版本,默认的一个解析器被移除了导致项目创建失败解决办法把node_modules里的prettier删掉,重现下个之前的版本 npm install prettier@~1.12.0再运行就可以了
npm install prettier@~1.12.0
npm run dev
然而并未能解决。。。呜呜。
但是,昨天直到今天早上突然的恍然大悟啊啊啊 a,是自己没有好好看到自己的报错,一味去看网上跟自己的报错相似的帖子
ERROR Failed to compile with 2 errors 00:21:38
error in ./src/App.vue
Module build failed: BrowserslistError: F:\WEB\HBuilder\app\travelApp contains both browserslist and package.json with browsers
完全没有认真分析自己的报错,就盲目的上网找,这应该是最最忌讳的啊啊啊,
来段这个的翻译
错误无法编译,2个错误,00:21:38
错误。/ src / App.vue
模块构建失败:BrowserslistError:F:WEB HBuilder应用travelApp包含了browsercraigslist和package.json和浏览器
应该是browsercraigslist的相关文件跟package,json不能同时存在的意识罢.,望大神经过帮忙修正,..
所以我尝试过先把package.jsons删了,更多错就来来,ctrl z,然后尝试吧browsercraigslist相关文件删了,运行npm run dev
ok 成功拉啊啊啊啊啊啊,觉得真的是蠢到自己了啊啊啊啊