Hacktoberfest 2026: những issue maintainer đã đánh dấu cho tháng Mười, đang mở và phù hợp người mới. Xem issue Hacktoberfest

`ng generate app-shell` and `ng generate module --route` produce broken imports when a component `type` is configured

Đang mở
  • Có gì không ổn?
#34,449 0 bình luận 0 reaction 0 người được giao Xem trên GitHub

Maintainer thường phản hồi trong vòng 1 ngày

@MeAkib đang làm issue này rồi.

Từ ngày 20/10/2026.

  • #34450 của @MeAkib — đang mở

Đánh giá

Độ khó
3/5
Thời gian dự kiến
1-2 ngày
Mức phù hợp với người mới
35/100
Loại issue
Lỗi
Độ rõ ràng
Đặc tả rõ ràng
Mức độ hoạt động
Đình trệ
Công nghệ
angular, typescript
Lĩnh vực
build-system, cli

Hướng nghiên cứu

Read packages/schematics/angular/app-shell/index.ts and the routing and non-routing module templates named in the issue, then compare how the library schematic handled this in commit 661609e3e. Reproduce with the two commands in the issue using the described component type configurations. Done means both generated imports resolve and the builds succeed; an open pull request is already linked.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Mô tả

area: @schematics/angular
Command

generate

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

19.x (before the v20 file naming change)

Description

ng generate app-shell and ng generate module <name> --route <path> --module <parent> generate a component and then
reference it with a hard-coded file path and class name. Both assume the v20+ defaults (no type in the file or class
name). When the workspace configures a component type, the component inherits it and the hard-coded references no
longer match, so the build fails.

Workspaces get a component type in two common ways:

  1. Every workspace updated to v20 with ng update: the migration that keeps the previous style guide behaviour
    (fdc6291dda) adds "@schematics/angular:component": { "type": "component" }.
  2. ng new --file-name-style-guide=2016, which adds { "type": "component", "addTypeToClassName": false }.

Hard-coded references:

  • packages/schematics/angular/app-shell/index.ts: withAppShell(AppShell) and
    insertImport(..., 'AppShell', './app-shell/app-shell').
  • packages/schematics/angular/module/files/.../__name@dasherize__-routing__typeSeparator__module.ts.template (and the
    non-routing module template for --route without a routing module): import { <%= classify(name) %> } from './<%= dasherize(name) %>';

The library schematic had the same problem (#26981) and was fixed in 661609e3e by passing an explicit type: '' to the
component schematic.

Minimal Reproduction

app-shell (updated-workspace configuration):

ng new ws --defaults
cd ws
# what `ng update` to v20 adds to angular.json under projects.ws.schematics:
#   "@schematics/angular:component": { "type": "component" }
ng generate app-shell
ng build

Generated src/app/app-shell/app-shell.component.ts contains export class AppShellComponent {}, but
src/app/app.config.server.ts contains:

import { AppShell } from './app-shell/app-shell';
...
provideServerRendering(withRoutes(serverRoutes), withAppShell(AppShell))

module --route (2016 file name style):

ng new ws --no-standalone --file-name-style-guide=2016 --defaults
cd ws
ng generate module feature --route feature --module app
ng build

Generated src/app/feature/feature-routing.module.ts:

import { Feature } from './feature'; // the file is feature.component.ts
Exception or Error
# app-shell
✘ [ERROR] TS2307: Cannot find module './app-shell/app-shell' or its corresponding type declarations. [plugin angular-compiler]
✘ [ERROR] Could not resolve "./app-shell/app-shell"

# module --route
✘ [ERROR] Could not resolve "./feature"
✘ [ERROR] TS2307: Cannot find module './feature' or its corresponding type declarations. [plugin angular-compiler]
Your Environment
Angular CLI       : 22.2.3
Node.js           : 24.15.0
Package Manager   : npm 11.12.1
Operating System  : darwin arm64
@schematics/angular : 22.2.3
Anything else relevant?
  • Affected since 20.0.0 (hard-coded names from 23fc8e1e17, "generate components without a .component
    extension/type"). Same code on 21.2.x and 22.2.x.
  • Suggested fix: follow 661609e3e and pass type: '' (and addTypeToClassName: false, so the class name stays
    AppShell/Feature) to the component schematic in app-shell and module, so the generated files always match
    the references. Happy to send a PR.
  • The module --route case with addTypeToClassName: false also hits #<issue for 01> (wrong NgModule declaration);
    link the two once filed.
Ngôn ngữ chính
TypeScript
Star
27k
Fork
11.8k
Merge trung bình
1 ngày 6 giờ
Pull request đã merge (30 ngày)
216

Chuẩn bị môi trường

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của angular/angular-cli

Tất cả issue của angular/angular-cli

Issue tương tự

Thêm issue về TypeScript

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.