React项目引入jQuery提示Module not found问题求助

AI 小北

2026-5-21

解决React中引入jQuery提示"Module not found: Can't resolve 'jquery'"的问题

我来帮你排查几个常见的原因和对应的解决办法：

确认jQuery已正确安装到项目本地
虽然你提到用npm加载了jQuery，但有可能是全局安装（执行了npm install -g jquery）或者安装过程出错了。先检查项目根目录下的package.json文件，看看dependencies或devDependencies里有没有jquery的条目。如果没有，在项目根目录重新执行：
```
npm install jquery
```
安装完成后再确认package.json里是否出现了jquery的版本信息。
自定义webpack配置的项目需调整解析规则
如果你的React项目不是用Create React App生成的，而是自己配置的webpack，可能需要在webpack配置文件中添加别名或配置resolve选项，让webpack能正确识别jquery：
```
const webpack = require('webpack');

module.exports = {
  // ...其他配置项
  resolve: {
    alias: {
      'jquery': require.resolve('jquery')
    }
  },
  plugins: [
    new webpack.ProvidePlugin({
      $: 'jquery',
      jQuery: 'jquery'
    })
  ]
};
```
配置完成后重启项目测试。
Create React App项目可尝试换种导入方式
部分情况下，Create React App的默认配置对ES模块导入可能有小问题，你可以试试用CommonJS的方式导入：
```
const $ = require('jquery');
```
另外也可以跳过npm安装，直接在public/index.html里通过CDN引入jQuery：
```
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
```
之后在App.js里直接使用window.$即可调用jQuery。
TypeScript项目需额外安装类型定义
如果你的项目是TypeScript编写的，除了安装jquery，还需要安装对应的类型包，否则可能出现模块解析或类型错误：
```
npm install @types/jquery --save-dev
```
清理缓存后重新安装依赖
如果以上方法都无效，可以尝试清理npm缓存并重装所有依赖：
```
npm cache clean --force
rm -rf node_modules package-lock.json
npm install
```