webpack打包公共库

JavaScript0148

webpack打包公共库,第1张

如果我们打包的⽬的是⽣成⼀个供别⼈使⽤的库,那么可以使⽤ output.library 来指定库的名称,库

的名称⽀持占位符和普通字符串:

output.libraryTarget

使⽤ output.library 确定了库的名称之后,还可以使⽤ output.libraryTarget 指定库打包出来的

规范, output.libraryTarget 取值范围

为: var 、 assign 、 this 、 window 、 global 、 commonjs 、 commonjs2 、 commonjsmodule 、 amd 、 umd 、 umd2 、 jsonp ,默认是 var ,

应该打包成umd

安装 terser-webpack-plugin@4.2.0压缩指定js文件

在webpack配置中增加optimization(优化配置)

```

// 优化配置

optimization:{

//是否开启优化

minimize:true,

// 覆盖默认压缩方式

minimizer:[new TerserWebpack({

test:/.min.js$/

})]

}

npm login

npm publish

通过 命令行工具打包: webpack app.js bundle.js打包完成后会在同目录下生成bundle.js.

app.js: 入口文件

bundle.js: 打包好的文件。

通过amd规范定义的, 打包后会生成一个bundle.js 和 一个 1.bundle.js, 两个bundle.js 文件