3回答

Dell

2019-03-12

已采纳

这块可能我说的有点问题，tree shaking 应该不会去处理css文件的，其实 sideEffects 里面是用来配置一些基础库的，比如说babel-polyfill这样的东西，避免因为没有使用，直接不打包了

0

0

慕勒1632382

2019-03-15

我实际验证了下：

当package.json中不给siedeEffects字段时，生产环境打包不会shaking掉import "@babel/polyfill"和import '../styles/main.scss'，页面能如期显示,async/await之类的代码可以正常运行。

当package.json给了sideEffect为false时，生产环境打包会shaking掉import '../styles/main.scss'，页面不能正常显示样式，但import "@babel/polyfill"没有被shaking，async/await之类的代码可以照常运行。

当然，给siedeEffects加上了["*.css"]之后在生产环境打包就没问题了。

我.babelrc的配置用的是初始配置：

{
"presets": [
"@babel/preset-env"
]
}

欢迎大家参与讨论、指正！

1

1

Dell

感谢同学，那这就证明实际上在开发环境下，tree shaking是不生效的，楼主你看看代码，估计还是你配置的不对。

2019-03-16

共1条回复

口是心飞

2019-04-18

是不是你没有开启css modules 原因 ，我在开发的自己配置的时候 发现了 tree shaking 在生产环境是会处理css文件的。我在index.js 导入的全局样式import './css/style.styl' 。 开发环境样式正确加载，   但是我打包之后缺少style.styl的内容。一直没找到原因 今天看到老师的课 实验了一下 才发现是开启了sideEffects：false ，现在已经修复了！

0

0