webpack打包公共库

初始化工程

代码语言：javascript复制

npm init -y # 初始化npm配置⽂件
npm install --save-dev webpack@4.43.0 # 安装核⼼库
npm install --save-dev webpack-cli@3.3.12 # 安装命令⾏⼯具

如果我们打包的⽬的是⽣成⼀个供别⼈使⽤的库，那么可以使⽤ output.library 来指定库的名称，库 的名称⽀持占位符和普通字符串： output.libraryTarget

代码语言：javascript复制

module.exports = {
 output: {
 library: 'myLib' // '[name]'
 }
};

使⽤ output.library 确定了库的名称之后，还可以使⽤ output.libraryTarget 指定库打包出来的 规范， output.libraryTarget 取值范围 为： var 、 assign 、 this 、 window 、 global 、 commonjs 、 commonjs2 、 commonjsmodule 、 amd 、 umd 、 umd2 、 jsonp ，默认是 var ， 应该打包成umd

代码语言：javascript复制

{
 output: {
 library: 'myLib',
 filename: 'umd.js',
 libraryTarget: 'umd'
 }
}

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

代码语言：javascript复制

 npm install  terser-webpack-plugin@4.2.0 -D

在webpack配置中增加optimization(优化配置) ``` // 优化配置 optimization:{ //是否开启优化 minimize:true, // 覆盖默认压缩方式 minimizer:[new TerserWebpack({ test:/.min.js$/ })] }

代码语言：javascript复制

创建入口文件 inde.js

代码语言：javascript复制

if(process.env.NODE_ENV==='production'){
    module.exports=require('./dist/add-num.min.js')
}else{
    module.exports=require('./dist/add-num.js')
}

npm login

npm publish

npm 编程算法 文件存储 打包 webpack

0 人点赞