webpack 构建 npm 包优化
详情描述 webpack可用来构建发布到npm上去的给别人调用的js库,以下方案可以减少 npm 包的体积；
const nodeExternals = require('webpack-node-externals');
module.exports = {
entry: {
index: './src/index.js',
},
externals: [nodeExternals()],
target: 'node',
output: {
path: path.resolve(__dirname, '.npm'),
filename: '[name].js',
libraryTarget: 'commonjs2',
},
};
【webpack 构建 npm 包优化】这里有几个区别于web应用不同的地方：
- externals: [nodeExternals()]用于排除node_modules目录下的代码被打包进去，因为放在node_modules目录下的代码应该通过npm安装。
- libraryTarget: ‘commonjs2’指出entry是一个可供别人调用的库而不是可执行的，输出的js文件按照commonjs规范。
推荐阅读
- 自动化构建工具（二）（特性）
- 区块链|理解以太坊DApp及开发工具
- webpack 使用 （一） 原理的介绍
- webpack打包原理
- 动态引入（require, import）
- javascript|react使用笔记及生命周期
- webpack构建原理（实现一个简易的webpack构建器）
- gulp|如何进行清除web端缓存
- 自动化构建工具篇|【解决方案】webpack `Invalid Host/Origin header`问题