CSS-in-JS是组织CSS代码的方式，代表库有styled-component和emotion 传统CSS的缺陷缺乏模块组织 传统的JS和CSS都没有模块的概念，后来在JS界陆续有了 CommonJS 和 ECMAScript Module，CSS-in-JS可以用模块化的方式组织CSS，依托于JS的模块化方案，比如：// button1.ts import styled from '@emotion/styled' export const Button = styled.button color: turquoise; // button2.ts import styled from '@emotion/styled' export const Button = styled.button font-size: 16px; 两个文件的两个同名元素的CSS不会互相影响 2. 缺乏作用域 传统的CSS只有一个全局作用域，比如说一个class可以匹配全局的任意元素。随着项目成长，CSS会变得越来越难以组织，最终导致失控。CSS-in-JS可以通过生成独特的选择符，来实现作用域的...

CSS-in-JS是组织CSS代码的方式，代表库有styled-component和emotion 传统CSS的缺陷缺乏模块组织 传统的JS和CSS都没有模块的概念，后来在JS界陆续有了 CommonJS 和 ECMAScript Module，CSS-in-JS可以用模块化的方式组织CSS，依托于JS的模块化方案，比如：// button1.ts import styled from '@emotion/styled' export const Button = styled.button color: turquoise; // button2.ts import styled from '@emotion/styled' export const Button = styled.button font-size: 16px; 两个文件的两个同名元素的CSS不会互相影响 2. 缺乏作用域 传统的CSS只有一个全局作用域，比如说一个class可以匹配全局的任意元素。随着项目成长，CSS会变得越来越难以组织，最终导致失控。CSS-in-JS可以通过生成独特的选择符，来实现作用域的...