angular-cli icon indicating copy to clipboard operation
angular-cli copied to clipboard

[Application builder] Styles import resolution

Open ahestin opened this issue 1 year ago • 1 comments

Command

build

Is this a regression?

  • [X] Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

Style import resolution has changed when I moved from the browser builder to the application builder. This problem only occurs when a node_modules file exists with both extensions in the same folder. It think there is some fallback that has been broken for this case. I didn't find anything regarding this issue into the documention.

Minimal Reproduction

styles.scss file content

@import "./app";
@import '@progress/kendo-theme-bootstrap/dist/all';

File system

  • src
    • app
      • app.css
      • app.scss
      • styles.scss
  • node_modules
    • @progress
      • kendo-theme-bootstrap
        • dist
          • all.css
          • all.scss

Results

The first app import resolution is still working: both builders took app.scss 👍 The second all import resolution doesn't have the same behavior: the old browser builder took all.scss whereas the the new application builder took app.css 👎

Exception or Error

No response

Your Environment

_                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/


Angular CLI: 17.0.8
Node: 20.10.0
Package Manager: npm 10.2.3
OS: win32 x64

Angular: 17.0.8
... animations, cli, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------       
@angular-devkit/architect       0.1700.8
@angular-devkit/build-angular   17.0.8
@angular-devkit/core            17.0.8
@angular-devkit/schematics      17.0.8
@schematics/angular             17.0.8
rxjs                            7.8.1
typescript                      5.2.2
zone.js                         0.14.2

Anything else relevant?

No way to reproduce it on Stackblitz but I reproduce it on my local machine using ng new to be sure there is no side effect.

ahestin avatar Dec 22 '23 15:12 ahestin

Specifying the intended extension would most likely be the best option currently in this case (@progress/kendo-theme-bootstrap/dist/all.scss). The behavior of Sass deep importing into a package reference is unfortunately not well-defined and not supported by Sass directly at all.

clydin avatar Jan 05 '24 19:01 clydin

Related issue https://github.com/angular/angular-cli/issues/27162 Perhaps my issue is duplicated.

csaszika avatar Feb 26 '24 09:02 csaszika

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.