Angular 12组件未加入模块declarations仍可正常渲染的原因咨询

你遇到的这个差异本质是Angular独立组件（Standalone Component）和传统NgModule绑定组件的规则差异导致的：

1. 可正常渲染的路由组件都是独立组件
   Angular 14及以上版本引入的独立组件，会在@Component装饰器中配置standalone: true属性，这类组件本身就是独立的编译单元，不需要在任何NgModule的declarations数组中声明，直接在路由配置中引用即可被Angular编译器识别、加载和渲染。
   你可以打开LoginComponent、PagenotfoundComponent、AdddealerComponent、ListdealersComponent的源码文件，就能看到它们的组件配置中都带有standalone: true的配置项。

2. LayoutComponent是传统非独立组件
   没有配置standalone: true的传统组件，必须在某一个NgModule的declarations数组中声明，Angular编译器才能识别该组件的元数据、完成编译流程。
   你的LayoutComponent属于传统非独立组件，且它被配置在DealerRoutingModule的父路由中，DealerRoutingModule又被导入到DealerModule中，所以它必须声明在DealerModule的declarations里，移除后编译器找不到对应的组件元数据，自然就会抛出编译异常。

补充说明：
如果希望LayoutComponent也不需要声明在declarations中，只需要给它的@Component装饰器添加standalone: true配置即可，同时它用到的公共指令、依赖组件都要要么是独立组件，要么在它的imports数组中导入对应的模块。

内容的提问来源于stack exchange，提问作者Ramee Ahmed