找不到 Webpack 模块：错误：无法解析"jquery"

Question

当我运行"webpack"命令时，出现此错误：

./js/main中的错误.js找不到模块：错误：无法解析"...\js"@ ./js/main.js 3：0-16 4：0-23 中的"jquery">

在package.json中，我有：

"devDependencies": {
   "handlebars": "^4.0.6",
   "handlebars-loader": "^1.4.0",
   "jquery": "^3.2.1",
   "path": "^0.12.7"
},

在 webpack.config 中.js：

var path = require("path");
module.exports = {
  entry: "./js/main.js",
  output: {
    path: __dirname + "/js",
    filename: "scripts-bundled.js"
  },
  resolve: {
    modules: [
      path.join(__dirname, "js/helpers")
    ]
  },
  module: {
    loaders: [
      {test: /.hbs$/, loader: "handlebars-loader"}
    ]
  }
};

在文件顶部.js我主要有：

import $ from 'jquery';

我也在主.js中使用车把。可能是车把或车把加载器干扰了 jquery 吗？我之前在另一个没有使用车把的项目中使用过 webpack 和 jquery 而没有这个问题，但也许它与它无关。

Answer 1

使用以下命令解决错误.
npm install --save jquery

Answer 2

就我而言，这是关于导入jquery而不是jQuery的东西，它是一个webpack配置：

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

看看这个：webpack 无法解析 'jquery'

Answer 3

车把与它无关。问题是您将resolve.modules更改为 [path.join(__dirname, "js/helpers")] .所以 webpack 只会在js/helpers中查找任何模块，但 npm 的 jquery 和其他依赖项都在node_modules中。resolve.modules的默认值为 ["node_modules"] 。您还需要添加node_modules以保持常规模块分辨率。

resolve: {
  modules: [
    path.join(__dirname, "js/helpers"),
    "node_modules"
  ]
},

Answer 4

如果您将 React 与 Bootstrap 一起使用并且收到此错误，则可能是因为您使用的是较低版本的 Bootstrap。我通过将版本升级到 Bootstrap 版本 5 解决了它。

Answer 5

如果使用 mac OSX、npm 版本 5.0.0 或更高版本，请在项目文件夹终端上尝试以下命令：npm install jquery jquery-ui 。

Answer 6

Rails 6 ： yarn add jquery为我工作