next.js - TailwindCSS + NextJS：集成 PostCSS 和 IE11 支持（自定义属性）

Question

根据文档，tailwind 声明它支持 ie11。

...但它使用ie11不支持的自定义属性。

我们正在尝试在一个最小的 nextjs 项目中使用它，其中包含以下内容postcss.config.js：

module.exports = {
  plugins: [
    'postcss-import',
    'tailwindcss',
    'autoprefixer',
    ['postcss-custom-properties', { preserve: false }]
  ]
};

我们要导入的唯一 css 文件：

@import 'tailwindcss/base';
@import 'tailwindcss/components';
@import 'tailwindcss/utilities';

这条线['postcss-custom-properties', { preserve: false }]似乎没有做任何事情。两者都有默认值和那个。

显然，由于 ie 11 不支持自定义属性，所以像transform实用程序这样的东西完全被忽略了。

有人对此有什么建议吗？我花了太多时间试图让它发挥作用：|

Answer 1

我仍在试验哪个是最佳值，但target您的属性postcss.config.js是负责任的，将其设置为ie11所有自定义 css 属性将被删除。

该target物业没有记录，但我发现这个问题解释了这种情况。如果您使用的是浏览器列表，请尝试使用

module.exports = {
  target: 'browserslist',
}