webpack踩坑 没法解析jquery及webpack-cli

最近在学习Vue,使用到webpack的时候,出现了错误,多是3和4的版本问题javascript

webpack-dev-server

安装好webpack-dev-server后,须要在package.jsonscripts 增长代码 "dev": "webpack-dev-server"java

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "dev": "webpack-dev-server"
  },

而后此时报错了~~~The CLI moved into a separate package: webpack-clinode

一大堆,一开始没看懂,搜也没搜明白,最后发现好简单,实际就是安装webpack-cli就行了jquery

没法解析jquery Module not found: Error: Can't resolve 'jquery' in 'F:\Study\webpack-study\src'

看到这个有点懵,我都安装了的,而后也能运行起来,结果就是报这个错。webpack

因为jquery.placholder.min.js将UMD用做加载策略,所以它认识到它是经过require- 必需的,并尝试以相同的方式要求使用jQuery:web

"object"==typeof module&&module.exports?require("jquery"):jQuery

Webpack查看require("jquery")并尝试捆绑jQuery库(在node_modules中不存在)
解决方案是将jQuery做为外部添加到您的webpack.config.jsjson

{
  ...
  externals: {
    // require("jquery") is external and available
    //  on the global var jQuery
    "jquery": "jQuery"
  }
}

当模块标记为外部模块时,Webpack不会捆绑该模块,而是使用全局变量。webpack-dev-server

参考资料:webpack Can't resolve 'jquery'.ide

em。。。。上边的并不合适。。。学习

仍是使用ProvidePlugin的吧
自动加载模块,而没必要处处 import 或 require 。

new webpack.ProvidePlugin({
  $: 'jquery',
  jQuery: 'jquery'
})

而后把import的地方干掉...
参考资料:webpackjs ProvidePlugin.

相关文章
相关标签/搜索