Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Style URL pointing to a TypeScript file gives a confusing error #32193

Open
@HazzMan2409

Description

Command

build

Is this a regression?

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

The previous version in which this bug was not present was

No response

Description

I was doing something silly and accidentally pointed to my components TypeScript file instead of its CSS file.

@Component({
 selector: 'app-root',
 imports: [RouterOutlet],
 templateUrl: './app.html',
 styleUrl: './app.ts'
})

And I got a bunch of TypeScript compilation errors to do with rxjs:

✘ [ERROR] Could not resolve "./internal/operators/skipUntil" [plugin angular-compiler]
 node_modules/rxjs/dist/esm5/index.js:140:26:
 140 │ export { skipUntil } from './internal/operators/skipUntil';
 ╵ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
✘ [ERROR] Could not resolve "./internal/operators/skipWhile" [plugin angular-compiler]
 node_modules/rxjs/dist/esm5/index.js:141:26:
 141 │ export { skipWhile } from './internal/operators/skipWhile';
 ╵ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
✘ [ERROR] Could not resolve "./internal/operators/startWith" [plugin angular-compiler]
 node_modules/rxjs/dist/esm5/index.js:142:26:
 142 │ export { startWith } from './internal/operators/startWith';

I think this error message is confusing (and because I had a large diff at this point it took me a long time to figure out what I'd done wrong).

Can we not assert the file extension is what is expected for URL properties in a component decorator and give a better error message?

Minimal Reproduction

Point a components styleURL to its TypeScript file.

Exception or Error

Your Environment

_ _ ____ _ ___
 / \ _ __ __ _ _ _| | __ _ _ __ / ___| | |_ _|
 / しろさんかく \ | '_ \ / _` | | | | |/ _` | '__| | | | | | |
 / ___ \| | | | (_| | |_| | | (_| | | | |___| |___ | |
 /_/ \_\_| |_|\__, |\__,_|_|\__,_|_| \____|_____|___|
 |___/
 
Angular CLI : 21.0.4
Angular : 21.0.6
Node.js : 22.17.1
Package Manager : npm 10.9.2
Operating System : darwin arm64
┌───────────────────────────┬───────────────────┬───────────────────┐
│ Package │ Installed Version │ Requested Version │
├───────────────────────────┼───────────────────┼───────────────────┤
│ @angular/build │ 21.0.4 │ ^21.0.4 │
│ @angular/cli │ 21.0.4 │ ^21.0.4 │
│ @angular/common │ 21.0.6 │ ^21.0.0 │
│ @angular/compiler │ 21.0.6 │ ^21.0.0 │
│ @angular/compiler-cli │ 21.0.6 │ ^21.0.0 │
│ @angular/core │ 21.0.6 │ ^21.0.0 │
│ @angular/forms │ 21.0.6 │ ^21.0.0 │
│ @angular/platform-browser │ 21.0.6 │ ^21.0.0 │
│ @angular/router │ 21.0.6 │ ^21.0.0 │
│ rxjs │ 7.8.2 │ ~7.8.0 │
│ typescript │ 5.9.3 │ ~5.9.2 │
│ vitest │ 4.0.16 │ ^4.0.8 │
└───────────────────────────┴───────────────────┴───────────────────┘

Anything else relevant?

No response

Metadata

Metadata

Assignees

No one assigned

    Type

    Projects

    No projects

    Milestone

    No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions

        AltStyle によって変換されたページ (->オリジナル) /