Using angular-cli at the command line, I executed:
ng set defaults.styleExt styl
to set the default styling to Stylus and I got this response:<
OK I did a diff on a project generated with:
ng new --style=styl PROJECT_NAME
and the same without the --style flag and the differences in the angular.json config file are represented in the 2 .png files attached.
Using these diffs, I manually made the changes to angular.json as follows:
(1) Change projects.PROJECT_NAME.schematics
as follows:
"schematics": {
"@schematics/angular:component": {
"styleext": "styl"
}
}
(2) Change projects.PROJECT_NAME.architect.build.options.styles
as follows:
"styles": [
"src/styles.styl"
]
(3) Change projects.PROJECT_NAME.architect.test.options.styles
as follows:
"styles": [
"styles.styl"
]
(4) Rename src/styles.css to src/styles.styl
Your existing components will happily continue to use .css
but new components will now be generated with .styl
files.
Diffs in PNG format as follows:
...