必须配对 browserslist 和 features 配置，否则 @container、color-mix() 等语法无法解析或转译；需手动创建含 stage 和 features 的 postcss.config.js，并在根目录配置 .browserslistrc 或 package.json 中的 browserslist 字段。
能用，但必须配对 browserslist 和 features，否则写了 @container 或 color-mix() 也白搭——插件根本不知道该不该动、怎么动。
必须手动创建 postcss.config.js，Vite 不会自动加载 preset-env
Vite 虽内置 PostCSS 支持，但默认不启用任何插件。不显式配置，postcss-preset-env 就是摆设。
- 在项目根目录新建
postcss.config.js，内容不能空，也不能只写require('postcss-preset-env') - 必须传入配置对象，至少包含
stage和features，例如：module.exports = { plugins: [ require('postcss-preset-env')({ stage: 3, features: { 'nesting-rules': true, 'custom-properties': true, 'container-queries': true } }) ] } - 不写
features: { 'container-queries': true }，@container语法直接报错（解析失败），不是“没效果”，而是根本过不了编译
browserslist 缺失会导致所有特性“看似生效实则失效”
postcss-preset-env 的所有转译逻辑都依赖 browserslist 推导兼容性。没它，stage: 3 白设，aspect-ratio 可能原样输出到 IE11 里。
- 必须在项目根目录放
.browserslistrc，内容示例：> 1% last 2 versions not dead ie 11
- 或写在
package.json里："browserslist": ["> 1%", "last 2 versions", "not dead"] - 常见坑：只写
last 2 versions，结果 Chrome 111+ 和 Safari 16.4 都支持:has()，插件就直接保留，旧版 Safari 用户看到空白布局——你得自己加降级
features 开关 ≠ 自动 polyfill，很多特性根本没法静态降级
开启 'color-function': true 只让 color-mix() 语法合法；浏览器不支持？它不会生成 background: #fff fallback，只会原样输出并被忽略。
立即学习“前端免费学习笔记（深入）”；
-
@container：开了container-queries也只是让 CSS 解析通过，不生成媒体查询模拟，必须额外引入@csstools/container-query-polyfill并在 JS 中注册 -
relative-color-syntax、@layer同理：无静态替代方案，插件只做语法接纳和前缀补全（如有） -
nesting-rules是少数真能降级的：& .child会被展开成.parent .child，但嵌套过深时可能产生冗余选择器
最常被忽略的一点：postcss-preset-env 不处理运行时行为差异。比如 Safari 15.4 声称支持 @container，但对 container-type: inline-size 的计算有偏差——插件不管这个，你得靠真实设备测试或 JS 检测兜底。
