webpack2和tree-shaking的相关译文在这个链接中
可以看到webpack2要启用tree-shaking功能的话, 只需要复制粘贴.babelrc文件内容就行了, 相当方便. 现在有一个叫babel-preset-latest的babel预设, 可以更简单地达到这个目的.
此预设的相关demo在这里, 链接中的分支是启用了tree-shaking的分支, 为了对比要取消tree-shaking的话, 直接修改源码中的.babelrc, 用下面的语句就可以取消了:
{
"presets": ["es2015"]
}
element-ui非常适合tree-shaking技术, 但是目前element导出的是经过webpack打包后的代码, 无法被webpack2通过ES6 Module静态分析分析到, 因此目前tree-shaking对element-ui是无效的.
希望1.0正式版能够拥有这个实用的特性, 现在打包出来300+kb还是略大了.
smallpath
All 3 comments
经过提醒, 文档中已经有babel-plugin-component做了这件事了, 测试打包出来124k.
不好意思没仔细看文档.
smallpath
on 2 Nov 2016
还是应该要支持 tree shaking 的，因为之前我试验 webpack 2 一直没成功过，所以没改。
QingWei-Li
on 3 Nov 2016
现在webpack2的tree-shaking默认认为导入的函数有副作用，因此即使使用es6 module中export { default as Pagination } from '../packages/pagination/index.js'这种导出形式也无法真正完成tree-shaking(via)，需要等uglifyJS实现的/*#__PURE__*/被webpack支持才能弄。
目前来看babel-plugin-component和babel-plugin-transform-imports 这种直接导入文件的形式更加合适
smallpath
on 6 Apr 2017
Related issues
Zhao-github
·
3Comments
chenzhe-pro
·
3Comments
EdenSpark
·
3Comments
yorululu
·
3Comments
no5no6
·
3Comments
Most helpful comment
还是应该要支持 tree shaking 的，因为之前我试验 webpack 2 一直没成功过，所以没改。