如何用angular，ng-zorro-antd和更少的配置Tailwind CSS? [英] How to configure Tailwind css with angular, ng-zorro-antd, and less?

问题描述

我正在尝试使用 ng-zorro-antd 和 less Taiwind CSS 集成到 Angular 项目中>.

I'm trying to integrate Taiwind CSS in an Angular project using ng-zorro-antd and less.

我遇到错误:

ERROR in ./src/styles.less (./node_modules/css-loader/dist/cjs.js??ref--15-1!./node_modules/postcss-loader/src??embedded!./node_modules/less-loader/dist/cjs.js??ref--15-3!./node_modules/postcss-loader/src??postcss!./src/styles.less)
Module build failed (from ./node_modules/postcss-loader/src/index.js):
Error: Failed to find './themes/index'
  in [
    /Users/iguissouma/idea/test-ant-less-tailwind/node_modules/ng-zorro-antd/style
  ]
    at resolveModule.catch.catch (/Users/iguissouma/idea/test-ant-less-tailwind/node_modules/postcss-import/lib/resolve-id.js:35:13)
** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **

使用 angular构建的示例 project-repo -cli 并添加了 ng-zorro-antd @ nartc/tailwind-schematics 原理图.

A sample project-repo built with angular-cli and added ng-zorro-antd @nartc/tailwind-schematics schematics.

有什么办法解决这个问题吗?

Any idea how to solve this issue?

推荐答案

作为替代方案，您可以在有角项目中使用scss，而仅将其用于ng-zorro主题样式.然后在angular.json中同时包含styles.scss和theme.less文件.

As an alternative, you can use scss in your angular project and less only for ng-zorro theme style. then include both the styles.scss and theme.less files in the angular.json.

在styles.scss文件中添加这些顺风，并且与@ trungk18的jira clone项目具有完全相同的webpack.config.js.

add those tailwinds in the styles.scss file and have the exact same webpack.config.js with @trungk18's jira clone project.

基本上，解决方案是让angular处理scss并减少样式，而您的额外自定义webpack只需要处理顺风的scss格式.

Basically, the solution is to let angular handle the scss and less style and your extra custom webpack only needs to handle the scss format for tailwind.

这篇关于如何用angular，ng-zorro-antd和更少的配置Tailwind CSS?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！