react项目引入tailwindcss不生效解决方案

根据tailwindcss官网的操作步骤下来，样式未生效，且未报错，看了挺多的资料，还是并未解决。

后面在另一个项目尝试时，报了下面的问题：

Error: PostCSS plugin tailwindcss requires PostCSS 8

根据这个链接的提示，重新安装了兼容版本

npm uninstall -D tailwindcss postcss autoprefixernpm 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了，呼~