【Rollup学习】验证Rollup的Tree Shaking特性

Rollup的官方文档中提到了Rollup具有TreeShaking能力。

TreeShaking
它是目前前端中很多构建工具都有的一个特性,主要是对我们一些并未使用到的代码进行剔除,让我们打包后的代码体积更小,包含最少的内容。

RollupTree Shaking原理:
利用显式的 importexport 语句静态分析你导入的代码,并将排除任何实际上没有使用的内容。主要的一个方式还是通过AST抽象语法分析树去提取和剔除。

代码实际验证

// logger.js
export const log = msg => {
    console.log('--------INFO--------')
    console.log(msg)
    console.log('--------INFO--------')
}
export const error = msg => {
    console.log('--------error--------')
    console.log(msg)
    console.log('--------error--------')
}
// message.js
export default {
    hi: 'Hello world'
}
// index.js
// 导入模块成员
import { log } from "./logger";
import message from "./message";

// 使用模块成员
const msg = message.hi
log((msg))

实际打包效果:
【Rollup学习】验证Rollup的Tree Shaking特性_第1张图片

你可能感兴趣的:(Rollup,学习)