Hacktoberfest 2026: as issues que os mantenedores marcaram para outubro, abertas e boas para iniciantes. Ver issues do Hacktoberfest

`ng new --view-encapsulation` has no effect on generated components

Fechada
  • Algo errado?
#34,388 0 comentários 0 reações 0 responsáveis Ver no GitHub

Mantenedores costumam responder em até 1 dia

Um pull request relacionado já foi integrado.

  • #34389 de @MeAkib — integrado

Avaliação

Dificuldade
3/5
Tempo estimado
1-2 dias
Facilidade para iniciantes
35/100
Tipo de issue
Bug
Clareza
Claramente especificada
Status de atividade
Estagnada
Stack de tecnologia
angular, typescript
Domínio
build-system, cli

Direção de pesquisa

The issue identifies the ng new and ng generate application paths, the generated root App component, angular.json component schematic defaults, and main.ts bootstrap options. Trace how --view-encapsulation flows through those generation paths and compare the generated files with the reproduction steps. Done means the selected mode affects the initial component and later generated components under AOT.

Escrita pelo modelo de indexação a partir do texto da issue.

Descrição

area: @schematics/angular
Command

new

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

The --view-encapsulation option of ng new / ng generate application is documented as "Sets the view
encapsulation mode for components in the initial project", but it currently has no effect:

  1. The root App component is generated without encapsulation, so its styles stay scoped (Emulated).
  2. The value is not saved to the project's @schematics/angular:component defaults in angular.json, so components
    generated later with ng g c also use Emulated.
  3. For --no-standalone apps, main.ts gets bootstrapModule(AppModule, { defaultEncapsulation: ViewEncapsulation.X }).
    defaultEncapsulation is only read by the JIT compiler, so it has no effect with AOT, which is the default for
    ng build and ng serve.

This looks like #13689 again: it was fixed in 89797900db by setting the encapsulation on the root component and in
bootstrapModule, but the root component part was removed in 58bc5b8f2a (for #13742, invalid generated code), leaving
only the JIT-only option.

Minimal Reproduction
  1. ng new ve-repro --defaults --view-encapsulation=None (same result with --no-standalone)
  2. Add h1 { color: red; } to src/app/app.css
  3. ng build --configuration development
  4. The output contains h1[_ngcontent-%COMP%], i.e. the styles are still encapsulated.
  5. angular.json has no viewEncapsulation under projects.ve-repro.schematics, so ng g c foo also generates an
    Emulated component.
Exception or Error
Your Environment
Latest
Anything else relevant?

Possible fix: set encapsulation on the generated root component, save viewEncapsulation in the component schematic
defaults, and drop defaultEncapsulation from main.ts. Happy to send a PR.

Linguagem predominante
TypeScript
Estrelas
27k
Forks
11.8k
Merge médio
1d 6h
PRs com merge (30d)
224

Preparar o ambiente

Primeiros passos

  1. Leia a issue inteira e depois o guia de contribuição do projeto.
  2. Comente na issue dizendo que vai assumir — evita que duas pessoas façam o mesmo trabalho.
  3. Faça um fork do repositório e trabalhe em uma branch.
  4. Abra um pull request que referencie o número da issue.

Mais de angular/angular-cli

Todas as issues de angular/angular-cli

Issues semelhantes

Mais issues de TypeScript

Receba novas issues na sua caixa de entrada

Um resumo curto de issues do GitHub para quem está começando.