React 引用 jQuery

原由

计划用 React 做一个前台展示网站，设计用到了jQuery Smoove这个插件，所以在网上找了下怎么在 React 中引入jQuery,并让插件可以正常使用.

安装 jQuery

npm install jquery

注意，全是小写字母,不能写成 jQuery，会安装成功，但无法编译通过。

使用

1. 直接使用
   如果直接使用 jQuery 而不使用其他基于 jq 的插件的话，那么直接在 react 文件里 import 即可:
   import $ from 'jquery';
2. 为插件服务
   如果有其他基于 jq 的插件，则需要在 webpack 中添加全局设置(我使用的 create-react-app 初始化的项目).
   找到webpack配置路径：
   node_modules/react-scripts/config/webpack.config.dev.js(webpack.config.prod.js)
   在 plugins 属性中添加以下代码即可：

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

大功告成！

create-react-app 初始化的项目在node_modules，直接修改的话重新安装包就被覆盖了，如果有需要的话，可以执行 yarn eject，把引用的包本地化后再修改，或者使用其他脚手架初始化项目也可。