42 lines
1.6 KiB
Markdown
42 lines
1.6 KiB
Markdown
- Rollup 打包
|
||
- Tree Shaking：分析出没有使用的模块并自动擦除
|
||
- 因为ES模块依赖关系是确定的，所以可以在编译阶段分析出依赖关系，对AST语法树中没有使用的节点进行删除
|
||
- 常用配置
|
||
- 多产物配置
|
||
- 在 `output` 配置中，使用一个数组，把多种需求依次写上
|
||
- 多入口配置
|
||
- 和 多产物配置类似，把不同的入口文件，都一次用对象或者数组的方式写在input 的位置即可
|
||
- 自定义 `output` 配置
|
||
- 常用output配置
|
||
``` javascript
|
||
output: {
|
||
// 产物输出目录
|
||
dir: path.resolve(__dirname, 'dist'),
|
||
// 以下三个配置项都可以使用这些占位符:
|
||
// 1. [name]: 去除文件后缀后的文件名
|
||
// 2. [hash]: 根据文件名和文件内容生成的 hash 值
|
||
// 3. [format]: 产物模块格式，如 es、cjs
|
||
// 4. [extname]: 产物后缀名(带`.`)
|
||
// 入口模块的输出文件名
|
||
entryFileNames: `[name].js`,
|
||
// 非入口模块(如动态 import)的输出文件名
|
||
chunkFileNames: 'chunk-[hash].js',
|
||
// 静态资源文件输出文件名
|
||
assetFileNames: 'assets/[name]-[hash][extname]',
|
||
// 产物输出格式，包括`amd`、`cjs`、`es`、`iife`、`umd`、`system`
|
||
format: 'cjs',
|
||
// 是否生成 sourcemap 文件
|
||
sourcemap: true,
|
||
// 如果是打包出 iife/umd 格式，需要对外暴露出一个全局变量，通过 name 配置变量名
|
||
name: 'MyBundle',
|
||
// 全局变量声明
|
||
globals: {
|
||
// 项目中可以直接用`$`代替`jquery`
|
||
jquery: '$'
|
||
}
|
||
}
|
||
```
|
||
- 依赖external
|
||
- 暂时不理解
|
||
- 接入插件的能力
|
||
- |