Discussion on: Angular 8/9/10 + Tailwind CSS Guide

[robert-tom]

Hi,

After setting it with the custom webpack builder before using the schema is easy.

We implemented the apply via custom repository packages.
To make this work we modified the webpack config to also use the sass loader and url-resolver:

module.exports = {
module: {
rules: [
{
test: /\.scss$/,
use: [
{
loader: 'postcss-loader',
options: {
postcssOptions: {
ident: 'postcss',
syntax: 'postcss-scss',
plugins: [
require('postcss-import'),
require('tailwindcss'),
require('autoprefixer'),
],
},
},
},
"resolve-url-loader",
"sass-loader",
]
},
],
},
};

So in the style.scss we can add
@import 'tailwindcss/base';

@import 'tailwindcss/components';

@import 'tailwindcss/utilities';
/* You can add global styles to this file, and also import other style files */

@import "~@"; @import "~@....";