webpack:

  1. plugins:[
  2. new webpack.optimize.UglifyJsPlugin({
  3. compress:{warning:true}
  4. })
  5. ]

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

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

我的TypeScript配置tsconfig.json :

  1. compilerOptions:{
  2. target:'es5',
  3. module:'es2015'
  4. .....
  5. }

所以~

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

  1. plugins:[
  2. new require('babili-webpack-plugin')()
  3. ]

当然,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. asp.net 5 中应用程序根目录及物理文件根目录的获取方式 此文已过期,不再适应rc1以后的版本

    之前看了asp.net5,小弟就试着用了用,做了个小网站练习一下,有一个小模块需要上传图片到wwwroot下的images文件夹,但是aspnet5 发生了翻天复地变化,之前获取网站根目录的的方法不再 ...

  2. MicroERP开发技术分享:vsFlexGrid、scriptControl实现工资表自定义列与表间关系计算

    开发大型的MIS系统,肯定是离不开第三方控件的,同时也要根据项目需要自己写几个. MicroERP共用了以下几个控件: 第三方商业控件: vsFlexGrid:大名鼎鼎的表格控件,不用多说,配合vsP ...

  3. DotNetBar for Windows Forms 12.9.0.0_冰河之刃重打包版及制作Visual Studio C#项目模板文件详解

    关于 DotNetBar for Windows Forms 12.9.0.0_冰河之刃重打包版 --------------------11.8.0.8_冰河之刃重打包版-------------- ...

  4. vps推荐之DigitalOcean

    作为一个爱折腾的网站”程序猿“,我用过多家vps,由于一般支持paypal 月付, 所以基本上都会用两三个月,不行就换另一家. 1.Yard VPS 台湾人开的,有中文支持,貌似也支持支付宝付款,偶尔 ...

  5. 例子:Bluetooth app to device sample

    本例子演示了: 判断蓝牙是否打开,是通过一个HRsult值为0x8007048F的异常来判断的 catch (Exception ex) { if ((uint)ex.HResult == 0x800 ...

  6. [windows操作系统]目录和文件相关操作

    1.导出目录的树形结构到文本文件 tree /F d:\dir1 > d:\tree.txt 就是将d:\dir1的目录结构以树状形式输出报告到文件tree.txt中. 效果是这样的:

  7. Hibernate的增删改查

    一.搭建Hibernate开发环境,这里就不说了,直接说环境搭好后的事情. 二.项目的目录结构

  8. build and set proxy in Ubuntu

    build http://www.2cto.com/os/201310/249690.html set http://www.360doc.com/content/11/1112/00/2617151 ...

  9. iOS之数据安全

    一.数据安全 术语----- 密钥:密钥是一种参数, 它是在明文转换为密文, 或将密文转换为明文的算法中输入的参数. 密钥分为对称密钥和非对称密钥(也可以根据用途来分为加密密钥和解密密钥) 明文:没有 ...

  10. U盘被写保护如何解除 (转)

    U盘被写保护如何解除   在使用U盘的时候,一直都很正常,但是突然有一天,U盘被提示被写保护了,不能够进行读写数据,如果这时正着急使用,一定会被气疯了吧,其实解决这个问题,是非常简单的. U盘被写保护 ...