Minify your styled-components in next.js
问题起源AMP的custom-css:只允许50000size的css
这个其实蛮坑爹的,万一别人的站点就是比50000多怎么办? 无解!
哈哈,当然超出50000的页面应该是很少的,所以我们就不考虑这种情况了,我们今天是想去对已有的css做些优化:
我们这个amp站点的公共css当中有没用的注释信息和空的css classname,因为用的是styled-components
,所以看了
一下有关的配置项,发现了这样一项:
export default {
[
"styled-components",
{
"ssr": true,
"displayName": false,
"fileName": false,
"minify": true,
"pure": true,
"preprocess": false
}
],
}
"minify": true
这项试了一下可以让无用的classname直接del掉,但是最关键的注释还在,然后用了一种比较hacker的方式:
This link
这是使用之后的效果: