vue運行報錯
報錯描述These dependencies were not found
vue前端項目更新以後,運行報錯
ERROR Failed to compile with 5 errors 下午3:51:42
These dependencies were not found:
* heatmap.js in ./node_modules/[email protected]@babel-loader/lib!./node_modules/[email protected]@vue-loader/lib/sel
ector.js?type=script&index=0!./src/pages/work/problem.vue
* vue-baidu-map/components/map/Map.vue in ./src/main.js, ./node_modules/[email protected]@babel-loader/lib!./node_modu
les/[email protected]@vue-loader/lib/selector.js?type=script&index=0!./src/pages/work/problem.vue
* vue-baidu-map/components/map/MapView.vue in ./node_modules/[email protected]@babel-loader/lib!./node_modules/_vue-lo
[email protected]@vue-loader/lib/selector.js?type=script&index=0!./src/pages/work/problem.vue
* vue-baidu-map/components/search/LocalSearch.vue in ./node_modules/[email protected]@babel-loader/lib!./node_modules/
[email protected]@vue-loader/lib/selector.js?type=script&index=0!./src/pages/work/problem.vue
To install them, you can run: npm install --save heatmap.js vue-baidu-map/components/map/Map.vue vue-baidu-map/component
s/map/MapView.vue vue-baidu-map/components/search/LocalSearch.vue
> Listening at http://localhost:8066
更新代碼後,運行"npm run dev" 命令報錯,是因爲提交地圖相關代碼,需要插件支持,因此下面開始下載插件
1.下載 heatmap.js
D:\workspace_hbuilder\vue-admin-master>cnpm install --save heatmap.js
√ Installed 1 packages
√ Linked 0 latest versions
√ Run 0 scripts
√ All packages installed (1 packages installed from npm registry, used 346ms(network 343ms), speed 321kB/s, json 1(572B
), tarball 109.54kB)
2.下載 vue-baidu-map
D:\workspace_hbuilder\vue-admin-master>cnpm install --save vue-baidu-map
√ Installed 1 packages
√ Linked 12 latest versions
√ Run 0 scripts
peerDependencies link [email protected] in D:\workspace_hbuilder\vue-admin-master\node_modules\[email protected]@vue-baidu
-map unmet with D:\workspace_hbuilder\vue-admin-master\node_modules\vue(2.6.11)
Recently updated (since 2020-08-19): 1 packages (detail see file D:\workspace_hbuilder\vue-admin-master\node_modules\.re
cently_updates.txt)
√ All packages installed (11 packages installed from npm registry, used 1s(network 1s), speed 896.03kB/s, json 13(59.31
kB), tarball 1.07MB)
vue 打包報錯ERROR in xx.js from UglifyJs
ERROR in static/js/1.b1bd2364d7d04826fb20.js from UglifyJs
Unexpected token: operator (>) [./node_modules/[email protected]@vue-baidu-map/components/base/mixins/common.js:16,
0][static/js/1.b1bd2364d7d04826fb20.js:40844,30]
ERROR in static/js/vendor.96c0ded070a832778c51.js from UglifyJs
Unexpected token: operator (>) [./node_modules/[email protected]@vue-baidu-map/components/base/bindEvent.js:5,0][st
atic/js/vendor.96c0ded070a832778c51.js:49854,26]
Build failed with errors.
1.錯誤原因
在 UglifyJs 的 github issues #78 找到了這樣一個解決方案:由於 UglifyJs 只支持 ES5 而 element-ui 可能引入了一部分 ES6 的寫法,所以導致 webpack 打包失敗。 issue 裏最後給出的解決方案是用 beta 版本的Uglify-es 來代替 UglifyJs(Beta 版本引入了對 ES2015+)的支持。需要在前端工作目錄下用執行命令
cnpm i -D uglifyjs-webpack-plugin@beta
2.錯誤解決
修改前端文件夾下的build/webpack.base.conf.js 文件即可,修改如下: 修改前
module: {
rules: [
...
{
test: /\.js$/,
loader: 'babel-loader',
include: [resolve('src'), resolve('test')]
},
...]
}
修改後
module: {
rules: [
...
{
test: /\.js$/,
loader: 'babel-loader',//注意elementUI的源碼使用ES6需要解析
include: [resolve('src'), resolve('test'),
resolve('/node_modules/[email protected]@vue-baidu-map') // <<------ add code
]
},
...]
}
相當於將 element-ui 加入需要 babel 解析的包中,之後再次執行 npm run build, build 成功。
參考:https://blog.csdn.net/sing_sing/article/details/79146265?utm_source=blogxgwz6
參考:https://blog.csdn.net/Uncle_long/article/details/80336680
快速刪除node_modules
這個node_modules目錄,在windows上刪除特別慢,跟中病毒似的。處理方法如下:
1.安裝rimraf
在全局安裝rimraf模塊:
D:\workspace_hbuilder\vue-admin-master>cnpm install rimraf -g
2.命令刪除
然後通過其命令來快速刪除node_modules目錄
D:\workspace_hbuilder\vue-admin-master>rimraf node_modules
3.下載
重新環境支持:下載node_modules環境
D:\workspace_hbuilder\vue-admin-master>cnpm install
4.運行vue
D:\workspace_hbuilder\vue-admin-master>npm run dev
參考node_modules目錄刪除方法:https://www.cnblogs.com/25miao/p/12706845.html