PostCSS 能处理 Vue 中的 CSS-in-JS 写法吗？
我最近在 Vue 项目里尝试用 CSS-in-JS 的方式写样式，比如把样式对象直接写在 setup 里，然后绑定到 :style 上。但发现 PostCSS 插件（比如 autoprefixer）好像没生效，像 display: ‘flex’ 这种没加浏览器前缀。
是不是 PostCSS 根本不处理 JS 里的样式字符串？那我这种写法是不是没法用 PostCSS 的能力了？
<script setup>
const styleObj = {
display: 'flex',
flexDirection: 'column'
}
</script>
<template>
<div :style="styleObj">内容</div>
</template>1 条解答
解决办法是用 CSS 模块或者单独的 CSS 文件来写样式，这样 PostCSS 才能处理。如果你坚持要用 CSS-in-JS，可以考虑用 styled-components 或者 emotion 这些库，它们有自己的工具来处理浏览器前缀。
不过老实说，直接用 CSS 文件最简单，也最容易让 PostCSS 发挥作用。