Angular 17+独立配置中main.ts bootstrap 调用的最佳实践

我有一个关于Angular 17独立API配置中main.ts的bootstrap调用的问题.具体地说:是否应该将提供程序/导入添加到要导入到独立组件、指令和管道的 bootstrap 调用in addition to？

Some context:

我将一个遗留的Angular应用程序迁移到新的独立API配置中. 我用的是官方的standalone migration guide. 此示意图包含四个迁移步骤，其中第三个步骤是:

运行ng g@Angel/core:独立并 Select "Bootstrap the project 使用独立API"

此步骤将提供程序/导入从根NgModule模块复制到main.ts中的新 bootstrap 调用中.我的现在看起来是这样的:

bootstrapApplication(AppComponent, {
    providers: [
        importProvidersFrom(AppRoutingModule, BrowserModule, ReactiveFormsModule, 
        MatToolbarModule, MatButtonModule, MatIconModule, FormsModule, MatFormFieldModule, MatInputModule, MatProgressSpinnerModule),
        provideAnimations(),
        provideHttpClient(withInterceptorsFromDi())
    ]
}).catch(err => console.error(err));

例如，您可以看到，Angular material 导入已添加到bootstrap调用中的providersarray.它们还在需要它们的组件中单独导入，这在独立API设置中是必需的.

就这样.

• 为什么它们也会在 bootstrap 调用中导入？

• 我是否应该将将来使用的任何新导入也添加到 bootstrap 调用中？例如:如果将来我决定使用自动完成，我是否应该将MatAutocompleteModule添加到 bootstrap 调用以及组件中？

Update个

根据下面的意见/答案，迁移示意图在bootstrapApplication方法中添加的内容超过了必要/需要的数量(以确保顺利迁移).

我建议将其重构为app.config.ts模式.

重构后，我的设置是:

main.ts个

bootstrapApplication(AppComponent, appConfig)
    .catch((err) => console.error(err));

app.config.ts个

export const appConfig: ApplicationConfig = {
  providers: [
    provideRouter(routes),
    provideAnimations(),
    provideHttpClient()
  ]
};

其他导入项(见原帖子中的bootstrapApplication项)要么已过时，要么只应在组件一级导入.

更多信息:Getting started with standalone components