将文件标记为 side-effect-free(无副作用)

需要将 mode 配置设置成 development，以确定 bundle 不会被压缩：

const path = require('path');module.exports = {entry: './src/index.js',output: {filename: 'bundle.js',path: path.resolve(__dirname, 'dist'),},mode: 'development',optimization: {usedExports: true,},
};

src/title.js

document.title = "改标题";
export function getTitle() {console.log("getTitle");
}

src/index.js

import './title.js'
console.log('hello world')

bundle.js

(()=>{"use strict";document.title="改标题",console.log("hello world")})();

发现保留了代码 document.title="改标题" ，如果想这行代码也被 Tree Shaking 删除掉，可以在 package.json 文件中加上 "sideEffects": false, 这个配置，然后重新打包就没有这行代码了。

(()=>{"use strict";console.log("hello world")})();

注意，将文件标记为 side-effect-free(无副作用) ，所有导入文件都会受到 tree shaking 的影响。如果在项目中使用类似 css-loader 并 import 一个 CSS 文件，将会在生产模式中删除。

src/index.css

html,body {background: red;
}

src/index.js

import './index.css'console.log('hello world')

bundle.js

(()=>{"use strict";console.log("hello world")})();

发现打包的时候 index.css 的样式并没有打包进来。现在可以通过修改 sideEffects 配置选项，来设置CSS文件打包的时候取消 Tree Shaking 的影响。

sideEffects:["*.css"]

此数组支持简单的 glob 模式匹配相关文件。其内部使用了 glob-to-regexp（支持：*，**，{a,b}，[a-z]）。如果匹配模式为 *.css，且不包含 /，将被视为 **/*.css。

将文件标记为 side-effect-free(无副作用)相关推荐

undo表空间文件丢失恢复（4）--无备份无recover的情况下恢复
undo表空间的数据文件丢失,如果没有备份的情况下,而且丢失的undo文件可以置为offline状态后(注意是offline不是recover状态),则可以如下恢复,下边给出一个例子. undo表空间 ...
RAMdisk保存文件方案，解决关机后无盘镜像文件没了的方案
RAMdisk保存文件方案,解决关机后无盘镜像文件没了的方案内存大了用不完可以用ramdisk在内存中虚拟一个磁盘把常用软件.系统缓存.浏览器缓存.bt下载都放到这个虚拟磁盘中速度又快 ...
vscode-git中的U,M和D文件标记含义
vscode-git中的U,M和D文件标记含义! M modified 你已经在github中添加过该文件,然后你对这个文件进行了修改,就会文件后标记M U untracked 你在本地新建了这个文件 ...
undo表空间文件丢失恢复（3）--无备份无redo的情况下恢复
undo表空间的数据文件丢失,如果没有备份的情况下,而且redo也不可用,这个时候就要采用隐藏参数来恢复,下边给出一个例子. undo表空间文件丢失恢复(1)--有备份的情况下恢复:http://bl ...
android百度网盘倍速,百度网盘在线倍数播放-全网最强，已做群组视频适配，不用保存文件也可倍速，无vip限制（附加安卓倍速版）...
// ==UserScript== // @name 百度网盘在线倍数播放-全网最强,已做群组视频适配,不用保存文件也可倍速,无vip限制(附加安卓倍速版) // @namespace http:// ...
python为csv文件添加表头_python读csv文件时指定行为表头或无表头的方法
python读csv文件时指定行为表头或无表头的方法 pd.read_csv()方法中header参数,默认为0,标签为0(即第1行)的行为表头.若设置为-1,则无表头.示例如下: (1)不设置hea ...
小米笔记本电脑故障——USB口拷贝文件中断/电池在低温时无输出
--USB口拷贝文件中断/电池在低温时无输出本文主要叙述如何发现计算机故障,以及如何呈现.同时,也给网友传达如何正确与厂家交涉. 本电脑在2018年3月14日左右购买,在2018年9日前,给亲人使用 ...
小米高通系列清串号打开写号端口工具_小米qcn基带修复文件解决串号丢失和无信号附QCN写入工具及方法...
小米qcn基带文件解决串号丢失和无信号附QCN写入工具及方法红米Redmi 4X(santoni) 小米notePro(leo) 小米Note2(scorpio_2015213) 小米Note2(s ...
Effective-Java 优先考虑流中无副作用的函数
46. 优先考虑流中无副作用的函数如果你是一个刚开始使用流的新手,那么很难掌握它们.仅仅将计算表示为流管道是很困难的.当你成功时,你的程序将运行,但对你来说可能没有意识到任何好处.流不仅仅是一个 A ...

将文件标记为 side-effect-free(无副作用)

将文件标记为 side-effect-free(无副作用)相关推荐

最新文章

热门文章