项目里经常会包含一些常用库,如react、jquery等。WP之类的模板其实在HTML里已经自带了jquery,不需要在webpack中再打包进来。
- 确认库导出符号:在浏览器控制台里面确定这个库导出的符号,如jquery会导出一个全局变量
jQuery
- 在webpack的config中加入external:
external: { jquery: 'jQuery' }
其中作为key的”jquery”对应的是包名,也就是
import * as $ from "jquery";
这句话里的”jquery”;
作为value的”jQuery”对应的是jquery这个库在浏览器中导出的符号。
经过这样的操作后,jQuery就不会被webpack打包进来。当然,你需要在引入自己的脚本之前先在HTML中引入jQuery。
<script src="https://cdn.jsdelivr.net/npm/react@16.8.6/umd/react.production.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/react-dom@16.8.6/umd/react-dom.production.min.js"></script>
<script src="my_little_bundle.js"></script>