Angular v11 - stylus not resolving imports from libraries

[matheo]

🐞 bug report

Affected Package

The issue is caused by package @angular-devkit/build-angular

Is this a regression?

Yes, in Angular 10 stylus was working as expected.

Description

Angular 11 changed the webpack config of the stylus-loader, and it seems that it restricted the imports in a way that the documented stylus imports are not working as expected. In our company we use these kind of imports in out *.component.styl files:

@import '~@org/styles/color-palette'

1. it's clear for us that we are using the styles of our npm package, where any relative path to the includePaths is ambiguous.
2. we can cmd+click on the path and get into the file inside the IDE

The change made in Angular 11 is:

while in Angular 10 that configuration was:

🔬 Minimal Reproduction

Stackblitz seems to not support stylus :(
https://stackblitz.com/edit/styl-broken-in-ng11

🔥 Exception or Error

✔ Browser application bundle generation complete.

Initial Chunk Files               | Names         |      Size
main.cfc3b76aaa54664627cf.js      | main          | 340.45 kB
styles.8c019f30343e61daf3ad.css   | styles        |  18.56 kB
runtime.d6c52737d4587c65265f.js   | runtime       |   6.17 kB
polyfills.42418760f681beaedfed.js | polyfills     | 677 bytes

                                  | Initial Total | 365.85 kB

Build at: 2020-12-01T16:38:34.657Z - Hash: c1fbc675dd2caa6ff658 - Time: 9409ms

Error: ./src/styles.styl
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
ModuleBuildError: Module build failed (from ./node_modules/stylus-loader/dist/cjs.js):
Error: /media/work/website/src/styles.styl:1:9
   1| @import '~@org/styles/variables'
--------------^
   2| 
   3| *
   4|   box-sizing: border-box

failed to locate @import file ~@org/styles/variables.styl

    at Evaluator.visitImport (/media/work/website/node_modules/stylus/lib/visitor/evaluator.js:915:21)
    at Evaluator.Visitor.visit (/media/work/website/node_modules/stylus/lib/visitor/index.js:28:40)
    at Evaluator.visit (/media/work/website/node_modules/stylus/lib/visitor/evaluator.js:160:18)
    at Evaluator.visitRoot (/media/work/website/node_modules/stylus/lib/visitor/evaluator.js:707:27)
    at Evaluator.Visitor.visit (/media/work/website/node_modules/stylus/lib/visitor/index.js:28:40)
    at Evaluator.visit (/media/work/website/node_modules/stylus/lib/visitor/evaluator.js:160:18)
    at Evaluator.evaluate (/media/work/website/node_modules/stylus/lib/visitor/evaluator.js:247:15)
    at Renderer.render (/media/work/website/node_modules/stylus/lib/renderer.js:86:26)
    at Object.stylusLoader (/media/work/website/node_modules/stylus-loader/dist/index.js:118:8)
    at runLoaders (/media/work/website/node_modules/webpack/lib/NormalModule.js:316:20)
    at /media/work/website/node_modules/loader-runner/lib/LoaderRunner.js:367:11
    at /media/work/website/node_modules/loader-runner/lib/LoaderRunner.js:233:18
    at context.callback (/media/work/website/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
    at styl.render (/media/work/website/node_modules/stylus-loader/dist/index.js:124:7)
    at Renderer.render (/media/work/website/node_modules/stylus/lib/renderer.js:107:12)
    at Object.stylusLoader (/media/work/website/node_modules/stylus-loader/dist/index.js:118:8)

🌍 Your Environment

Angular Version:

Angular CLI: 11.0.2
Node: 10.22.0
OS: linux x64

Angular: 11.0.2
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Ivy Workspace: Yes

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1100.2
@angular-devkit/build-angular   0.1100.2
@angular-devkit/core            11.0.2
@angular-devkit/schematics      11.0.2
@angular/cdk                    11.0.1
@angular/flex-layout            11.0.0-beta.33
@schematics/angular             11.0.2
@schematics/update              0.1100.2
rxjs                            6.6.3
typescript                      4.0.5

[petebacondarwin]

Transferring to the CLI project...

[alan-agius4]

Blocked on webpack/stylus-loader#297