webpack踩坑 無法解析jquery及webpack-cli
阿新 • • 發佈:2020-04-17
最近在學習Vue,使用到webpack的時候,出現了錯誤,可能是3和4的版本問題
webpack-dev-server
安裝好webpack-dev-server
後,需要在package.json
的scripts
增加程式碼 "dev": "webpack-dev-server"
"scripts": { "test": "echo \"Error: no test specified\" && exit 1", "dev": "webpack-dev-server" },
然後此時報錯了~~~The CLI moved into a separate package: webpack-cli
一大堆,一開始沒看懂,搜也沒搜明白,最後發現好簡單,實際就是安裝webpack-cli就好了
無法解析jquery Module not found: Error: Can't resolve 'jquery' in 'F:\Study\webpack-study\src'
看到這個有點懵,我都安裝了的,然後也能執行起來,結果就是報這個錯。
由於
jquery.placholder.min.js
將UMD用作載入策略,因此它認識到它是通過require
- 必需的,並嘗試以相同的方式要求使用jQuery:
"object"==typeof module&&module.exports?require("jquery"):jQuery
Webpack檢視require("jquery")
並嘗試捆綁jQuery庫(在node_modules中不存在)
解決方案是將jQuery作為外部新增到您的webpack.config.js
:
{ ... externals: { // require("jquery") is external and available // on the global var jQuery "jquery": "jQuery" } }
當模組標記為外部模組時,Webpack不會捆綁該模組,而是使用全域性變數。
參考資料:webpack Can't resolve 'jquery'.
em。。。。上邊的並不合適。。。
還是使用ProvidePlugin的吧
自動載入模組,而不必到處 import 或 require 。
new webpack.ProvidePlugin({
$: 'jquery',
jQuery: 'jquery'
})
然後把import的地方幹掉...
參考資料:webpackjs ProvidePlug