[英]Error: Cannot find module 'jquery' on require.resolve('jquery') webpack
The problem is Error: Cannot find module 'jquery'
问题是Error: Cannot find module 'jquery'
When i build it with script:当我用脚本构建它时:
rm -rf dist && webpack --config webpack.config.js
Already tried with another clue like external etc but still got issue on jquery已经尝试过使用外部等其他线索,但在 jquery 上仍然有问题
Here is my package.json,这是我的 package.json,
{
"name": "webpack",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"build": "rm -rf dist && webpack --config webpack.config.js"
},
"devDependencies": {
"@babel/core": "^7.3.4",
"@babel/preset-env": "^7.3.4",
"autoprefixer": "^9.4.10",
"babel-loader": "^8.0.5",
"copy-webpack-plugin": "^5.0.4",
"css-loader": "^2.1.1",
"cssnano": "^4.1.10",
"expose-loader": "^0.7.5",
"file-loader": "^3.0.1",
"img-loader": "^3.0.1",
"mini-css-extract-plugin": "^0.5.0",
"postcss-loader": "^3.0.0",
"sass": "^1.17.2",
"sass-loader": "^7.1.0",
"url-loader": "^2.1.0",
"webpack": "^4.29.6",
"webpack-cli": "^3.2.3"
},
"author": "",
"license": "ISC",
"dependencies": {}
}
Here is my webpack.config.js,这是我的 webpack.config.js,
const path = require('path');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const CopyWebpackPlugin = require('copy-webpack-plugin');
const webpack = require('webpack');
module.exports = {
entry: './public/index.js',
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'bundle.js'
},
mode: 'development',
module: {
rules: [
{
test: /\.js$/,
exclude: /(node_modules)/,
use: {
loader: 'babel-loader',
options: {
presets: ['@babel/preset-env']
}
}
},
{
test: /\.(sa|sc|c)ss$/,
use: [
{
loader: MiniCssExtractPlugin.loader
},
{
loader: "css-loader",
},
{
loader: "postcss-loader"
},
{
loader: "sass-loader",
options: {
implementation: require("sass")
}
}
]
},
{ test: /\.(png|woff|woff2|eot|ttf|svg)$/, loader: 'url-loader?limit=100000' },
{
// Exposes jQuery for use outside Webpack build
test: require.resolve('jquery'),
use: [{
loader: 'expose-loader',
options: 'jQuery'
}, {
loader: 'expose-loader',
options: '$'
}]
}
]
}, externals: {
jquery: 'jQuery'
},
plugins: [
new MiniCssExtractPlugin({
filename: "bundle.css"
}),
new CopyWebpackPlugin([
{ from: './public/img', to: 'img' }
]),
new webpack.ProvidePlugin({
'$': 'jquery',
'jQuery': 'jquery',
'window.jQuery': 'jquery'
}),
]
};
On my entry file:在我的入口文件中:
import './css/reset.css';
import './css/main-1.0.css';
import './css/homepage-1.0.css';
import './js/jquery.lazy.min.js';
import './js/jquery.ellipsis.js';
import './js/main-1.0.js';
import './js/helper.js';
import './js/homepage-1.0.js';
I got stuck for this issue already 2 days.. any suggestion i'll do it,我已经被这个问题困住了 2 天了……任何建议我都会去做,
the error i got is on terminal side我得到的错误是在终端端
best regards.此致。
In my case, I was using require("jQuery")
in Windows, but it was not working in a Linux machine.就我而言,我在 Windows 中使用require("jQuery")
,但它在 Linux 机器上不起作用。 Linux is case-sensitive, so I had to use require("jquery")
. Linux 区分大小写,所以我不得不使用require("jquery")
。
在同一个项目中安装 npm i jquery 解决了我的问题
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.