这是一个创建于 2145 天前的主题，其中的信息可能已经有所发展或是发生改变。
之前一将近一年没弄前端的东西, 后来又来做前端了, 发现很多跟不上节奏, 有些感觉很别扭的东西, 特别是 css in js 这种操作, 比如像 react 的 styled-components, vue 的 sfc, 后者稍微好一点, 只是把内容混合在同一个文件了, 编译后还是分离的, 主要想说的是 styled-components. 我看了我们厂前面的人写的代码, 几乎全是用 styled-components 写样式, 并且都是和组件一起丢一个文件里面, 看起来特别凌乱. 另外还有一点, 这种方式写的样式只能丢在 js 里面, 结果就是如果做 ssr, 那首屏渲染时的样式就只能等 js 加载完了才能生效了. 所以我个人觉得这种方式是很不合理的, 唯一的好处也就是解决了 css 中语法集不健全, 没有办法像 js 那样好操作变量, 但是这种好处感觉很鸡肋啊, 随便用一个 scss 或者 less 这样的方言就能代替. 不知道社区的人怎么看这种东西?
8 条回复 • 2019-01-09 11:43:38 +08:00
 |
1
hilbertz 2019-01-08 23:41:23 +08:00
其实整个 b/s 开发都在逐渐转变为传统的 c/s 开发，浏览器成为了统一的客户端平台，而无论是 dom 还是 css 都由 js 来生成，这其实更贴近程序员的思维模式
|
 |
2
P233 2019-01-08 23:43:51 +08:00
对我来说 CSS in JS 唯一的优势是可以将 props 传入 CSS 样式创建动态 BEM modifier，其他地方没有能超越 Sass 的地方
|
 |
3
seki 2019-01-08 23:49:19 +08:00
styled components 之类的是有对应的 ssr 方案的
需要补充的话，好处还包括不需要再额外思考命名，有 typescript 支持，更方便共享主题变量等等。 |
|
4
seki 2019-01-08 23:53:23 +08:00
至于 css 写在 js 文件里让你觉得乱，在我看来，当你有十几个 view，几十个组件的时候，样式文件不管是单独放到 styles 里，还是离调用处尽量近，这一堆样式文件混在 src 文件夹里也挺乱的……
|
 |
5
shyangs 2019-01-08 23:53:40 +08:00
Anything that can be written in JavaScript, will eventually be written in JavaScript.
|
 |
6
duan602728596 2019-01-09 00:22:06 +08:00 via iPhone
觉得还是 css module 配合 mini-css-extract-plugin 比较好，ssr 的时候直接加载 css 文件。而且单纯只用 css 文件的话，其实样式很乱而且不好维护，我这有个项目就是因为 css 的原因，导致现在连代码分割都做不了了
|
|
7
duan602728596 2019-01-09 00:24:03 +08:00 via iPhone
而且我觉得 css module 或者 css in js 和 less sass 并没有冲突。会写 css 的，怎么都能写好，不会写的，用什么最后都是一团糟的
|
 |
8
demonzoo 2019-01-09 11:43:38 +08:00  1
似乎 angular 优雅的解决了这个问题，不过国内没什么人用罢了
|
Select Language