小编Rye*_*Rye的帖子

Tailwindcss 2 样式在 Angular 11 中不起作用

我正在一个新的 Angular 11 项目中尝试 Tailwindcss。我安装了以下开发包。

NOTE: Removed other packages for simplicity
"@angular-builders/custom-webpack": "^10.0.1",
"@angular-devkit/build-angular": "~0.1100.2",
"@angular/cli": "~11.0.2",
"@angular/compiler-cli": "~11.0.1",
"autoprefixer": "^10.0.2",
"postcss-import": "^13.0.0",
"postcss-loader": "^4.1.0",
"postcss-scss": "^3.0.4",
"tailwindcss": "^2.0.1",
Run Code Online (Sandbox Code Playgroud)

webpack.config.js

module.exports = {
  module: {
    rules: [
      {
        test: /\.scss$/,
        loader: 'postcss-loader',
        options: {
          postcssOptions: {
            ident: 'postcss',
            syntax: 'postcss-scss',
            plugins: () => [
              require('postcss-import'),
              require('tailwindcss'),
              require('autoprefixer')
            ]
          }
        }
      }
    ]
  }
}
Run Code Online (Sandbox Code Playgroud)

样式.scss

@import "tailwindcss/base";
@import "tailwindcss/components";
@import "tailwindcss/utilities";
Run Code Online (Sandbox Code Playgroud)

角度.json

"builder": "@angular-builders/custom-webpack:browser", //dev-server
"customWebpackConfig": { "path": "webpack.config.js" } …
Run Code Online (Sandbox Code Playgroud)

javascript webpack angular tailwind-css

6
推荐指数
1
解决办法
7630
查看次数

标签 统计

angular ×1

javascript ×1

tailwind-css ×1

webpack ×1