老师设置了module.hot如果再设置tree shaking,tree shaking就不生效了?
来源:4-1 Tree Shaking 概念详解
慕斯0315010
2019-07-19
这是我的入口文件
/***
** 入口模块
***/
import { header } from './header.js';
import { Ccontent} from './content.js'
const fragment = document.createDocumentFragment();
fragment.append(header);
fragment.append(Ccontent());
if (module.hot) {
module.hot.accept('./content.js',() => {
let ch = document.getElementById('cc');
document.body.removeChild(ch);
console.log(Ccontent())
document.body.append(Ccontent());
})
}
document.body.append(fragment);
/***
** 被引用的模块
***/
function Ccontent () {
const content = document.createElement('div');
content.setAttribute('id','cc');
content.innerHTML = '我是contsssst';
return content
}
function sayHi() {
console.log('你好');
}
export {
Ccontent,
sayHi
}
- 我个人理解为使用了
module.hot.accept
函数监听content
模块的变化,他的参数是一个回调函数,而回调函数是一个异步操作,而tree shaking
不支持异步调用模块,所以tree shaking
打包失效。 - 如果以上是对的话我想问一下原理,hot文档描述accept所有引用依赖模块(dependencies)的导入符号都会被自动更新 这句话是指我的
content
模块相当于被重新引入,然后accept
函数自动帮我解构出Ccontent
,sayHi
吗?
写回答
1回答
-
Dell
2019-07-24
异步代码目前webpack确实不支持tree shaking
是这么回事儿,底层是通过websocket实现的通信
00
相似问题