'...jQuery is not defined' 使用 webpack 但 jQuery 已定义答案

【问题标题】：'...jQuery is not defined' when using webpack but jQuery is defined'...jQuery is not defined' 使用 webpack 但 jQuery 已定义
【发布时间】：2018-12-19 08:08:31
【问题描述】：

当尝试在浏览器中加载我的捆绑脚本文件时，我得到：

Uncaught ReferenceError: jQuery is not defined

这应该来自last line in my bundled underscore-min.js being the issue：

}()

这没有任何意义？我不确定源地图文件是否让我误入歧途。我的配置在webpack.config.js是这样的：

entry: {
  main: [ 
    './js/jquery.min.js', 
    './js/other.js', 
    './js/other2.js', 
    './js/underscore-min.js'
  ]
},     

...

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

...

externals: {
  'jquery': 'jQuery',
  'jQuery': 'jQuery',
}

如果没有上述内容，大量依赖 jQuery 的其他包就会崩溃。导致这种情况的 underscore-min.js 脚本有什么独特之处吗？

【问题讨论】：

jquery js文件是否存放在定义的位置？网络服务器是否可读？
是的，它可以被 webpack 读取。在添加 ProvidePlugin 声明之前，其他文件抱怨他们无法访问 jQuery，但现在这是唯一的。

标签： javascript jquery webpack

【解决方案1】：

只需删除externals: { 'jquery': 'jQuery', 'jQuery': 'jQuery', }。

如果你想使用externals，

entry: {
  main: [ 
    './js/jquery.min.js', 
    './js/other.js', 
    './js/other2.js', 
    './js/underscore-min.js'
  ]
},     

...

...

externals: {
  'jquery': {
     root:'jquery',
     commonjs2:'jquery',
     commonjs:'jquery',
     amd:'jquery'
   }
},
output:{
   ...
   libraryTarget:"umd"
}

在你的html中，添加脚本标签 <script src="some-resources/jquery.js"></script>

【讨论】：

如果我从外部删除它，我会收到其他错误，cannot resolve jquery in xxx.js 文件。