webpack打包第三方typeahead.js

[qq_38872956]

后，在页面上显示报错，请问该如何正确打包这个js

[ambit_tsai-微信]

一定是打包姿势不对，话说，你是怎么打包的？

[persuit666]

typeahead依赖jquery，所以如下
1、webpack.config.js
output: {
path: __dirname + "/lib",//打包后的文件存放的地方
filename: "typeahead.min.js",//打包后输出文件的文件名
libraryTarget: "var"//输出格式-------------------------这个地方指定为var
},
externals: {
"jquery": "jQuery"//指定变量是从外部url引入的，这样插件合并就不会报编辑错误
},
2、入口文件里
require('imports-loader?$=jquery!./typeahead.js');//这个地方注意放你的未压缩的那个typeahead.js，
如果typeahead.js还依赖其它js，如法炮制多个require，但是注意顺序，被依赖的在最上边
3、使用
<script src="jquery.min.js" type="text/javascript"></script><!--引入jquery.min-->
<script src="typeahead.min.js" type="text/javascript"></script><!--这个是你的压缩后的js-->

不过建议别用webpack压缩，推荐使用专业的脚本压缩工具来压缩成min，这样体积更小，混淆更安全，webpack压出来的一般比较大，
一般对于非amd/cmd规范的最好用脚本压缩工具压缩

[persuit666]

最后忘说了 别忘了在
package.json里安装上依赖 devDependencies

"imports-loader": "^0.7.1"
我用的webpack 3.0