webpack:

plugins:[
new webpack.optimize.UglifyJsPlugin({
compress:{warning:true}
})
]

  是的,一些dead code 在打包后会被移除.比如没用的varible ,function。

但是classes会被UglifyJs作为side effect,然后跳过它。

我的TypeScript配置tsconfig.json :

compilerOptions:{
target:'es5',
module:'es2015'
.....
}

所以~

typescript=>es5 bundle =>UglifyJs

通过这条途径,classes是不会被删除的。

typescript=>es6 bundle =>UglifyJs

这条途径不行,UglifyJs不支持直接处理ES6文件。

------------------------------------------

好吧,搞了很久,我才找到babel为webpack提供了babili-webpack-plugin这么一个插件。

于是用它直接替换 UglifyJs就好了:

npm install babili-wepback-plugin -save-dev    //   babel-core >= 6.19.0

npm install babel-core@6.21.0

plugins:[
new require('babili-webpack-plugin')()
]

当然,tsconfig.json中target得设置为es2015(按es5输出,classes还是会存在)。

如此才是真正的tree shaking。

webpack使用tree shaking的问题。及关于UglifyJs不支持ES6的解决方案。的更多相关文章

  1. [Webpack 2] Tree shaking with Webpack 2

    The less code you can send to the browser, the better. The concept of tree shaking basically says th ...

  2. Webpack 的 Tree Shaking

    为什么要使用 Tree Shaking? 当从某文件模块中导出(某一个或几个变量.函数.对象等),然而这个文件模块还有许多其它(我们这次并不需要)的导出,webpack会不管三七二十一简单粗暴的将整个 ...

  3. Webpack 4 Tree Shaking 终极优化指南

    几个月前,我的任务是将我们组的 Vue.js 项目构建配置升级到 Webpack 4.我们的主要目标之一是利用 tree-shaking 的优势,即 Webpack 去掉了实际上并没有使用的代码来减少 ...

  4. 深入研究webpack之Tree Shaking相关属性sideEffects用处

    Tree Shaking我原来也只是了解,这次碰巧深入研究了下,就写个博客记录一下,网上有很多讲Tree Shaking的,我写的这篇跟他们侧重点不一样 Tree Shaking相关的基础知识 1 w ...

  5. webpack和tree shaking和rollup

    http://blog.csdn.net/haodawang/article/details/77199980 tree shaking只对es模块生效,在打包tyscript模块是要使用tsc编译器 ...

  6. Webpack 4教程 - 第七部分 减少打包体积与Tree Shaking

    转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者.原文出处:https://wanago.io/2018/08/13/webpack-4-course-part ...

  7. webpack(6)-模块热替代&tree shaking

    模块热替换(hot module replacement 或 HMR) 模块热替换(hot module replacement 或 HMR)是 webpack 提供的最有用的功能之一.它允许在运行时 ...

  8. 配置Tree Shaking来减少JavaScript的打包体积

    译者按: 用Tree Shaking技术来减少JavaScript的Payload大小 原文: Reduce JavaScript Payloads with Tree Shaking 译者: Fun ...

  9. 深入浅出的webpack构建工具---tree shaking打包性能优化(十二)

    阅读目录 1. 什么是tree-shaking? 2. 在webpack中如何使用 tree-shaking 呢? 3. 使用webpack-deep-scope-plugin 优化 回到顶部 1. ...

随机推荐

  1. 输入任意一个字符串,如:“abDEe23dJfd343dPOddfe4CdD5ccv!23rr”。取出该字符串中所有的字母。顺序不能改变!并把大写字母变成小写,小写字母变成大写!

    package lovo.Linyoujia; import java.util.Scanner; public class Java { @param args public static void ...

  2. centos7 jexus在vmware下能访问,主机访问不了解决方案

    能PING通,访问不了web,先在CMD测试telnet ip 80看看是否是防火墙的问题. 修改防火墙,打开指定端口 1 安装iptables [root@centos ~]# yum instal ...

  3. C#中Thread与ThreadPool的比较

    最近同事在编写一个基于UPD RTP协议的通信软件,在处理接收Listen时,发现了一个问题到底是用Thread还是ThreadPool呢? 我看同事的问题比较有典型性,还是做以整理培训一下吧 Thr ...

  4. Oracle Merge into 详细介绍

    Oracle Merge into 详细介绍 /*Merge into 详细介绍MERGE语句是Oracle9i新增的语法,用来合并UPDATE和INSERT语句.通过MERGE语句,根据一张表或子查 ...

  5. linux命令每日一练习 解压命令

    .tar 解包:tar xvf FileName.tar打包:tar cvf FileName.tar DirName(注:tar是打包,不是压缩!)———————————————.gz解压1:gun ...

  6. Disable testSuite and testCase on some environment

    def testEnv = context.expand('${#Project#testEnv}') String[] testCases = ["CheckEARouting(ADS)A ...

  7. JQuery基础总结下

    JQuery动画与特效 show()和hide()方法可以用来显示和隐藏元素,toggle()方法用来切换显示和隐藏. $(selector).hide(speed,[callback]); $(se ...

  8. hosts持续更新

    Google hosts网址: https://laod.cn/hosts/2016-google-hosts.html

  9. java nio(non-blocking io)简介及和io

    在 Java1.4之前的I/O系统中,提供的都是面向流的I/O系统,系统一次一个字节地处理数据,一个输入流产生一个字节的数据,一个输出流消费一个字节 的数据,面向流的I/O速度非常慢,而在Java 1 ...

  10. 一个百万数量级的mysql实例

    1.想做数据库调优的学习首先就要有一个较大数据集合的实例,在网上找了很久都没有找到具体的实例,后来在书中看到了employees_db字样,发现 mysql官方提供了一个做测试的较大的数据集,这正是我 ...