根据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了,呼~