react项目引入tailwindcss不生效解决方案
根据tailwindcss官网的操作步骤下来，样式未生效，且未报错，看了挺多的资料，还是并未解决。
后面在另一个项目尝试时，报了下面的问题：
Error: PostCSS plugin tailwindcss requires PostCSS 8
根据这个链接的提示，重新安装了兼容版本
npm uninstall -D tailwindcss postcss autoprefixer
npm install -D tailwindcss@npm:@tailwindcss/postcss7-compat postcss@^7 autoprefixer@^9
如果还未生效，可以检查webpack.config.js里postcss的配置
{
loader: require.resolve('postcss-loader'),
options: {
ident: 'postcss',
plugins: () => [
require('postcss-flexbugs-fixes'),
require('postcss-preset-env')({
autoprefixer: {
flexbox: 'no-2009'
},
stage: 3
}),
require('tailwindcss'), // ~~新增~~
postcssNormalize()
],
sourceMap: isEnvProduction && shouldUseSourceMap
}
}
目前按照这个流程走下来，两个项目都可以使用tailwindcss了，呼~