Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

style vs css 引入区别 #599

Open
benzhemin opened this issue Dec 31, 2021 · 1 comment
Open

style vs css 引入区别 #599

benzhemin opened this issue Dec 31, 2021 · 1 comment

Comments

@benzhemin
Copy link

{ "libraryName": "antd", style: true }
{ "libraryName": "antd", style: "css" }

Note : with style: true css source files are imported and optimizations can be done during compilation time. With style: "css", pre bundled css files are imported as they are.

style: true can reduce the bundle size significantly, depending on your usage of the library.

这里特别提示: 用style会显著减少bundle的体积 (引入antd),
我看到编译后的css.js 和index.js 都会引入 require("../../style/default.css"); 这个文件

这里想问一下, 为什么style方式会显著影响?

感谢您的回复.

@banbantx
Copy link

style: true 引入的是 [xxxxxx].less或scss文件。

css: true 引入的 css文件。 以button为例。

下图:butto的css为true的引用。
image

下图: style为true的引用文件。
image

less文件会进行编译,根据你所配置的css模块提取,应该还能做到公共less抽离。如果已经是css了,应该是不行。具体可以看下webpack的公共模块抽取插件。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants