将ng-bootstrap集成到ASP.NETCoreJavaScriptServices(Angular)项目中

我使用ASP.NET 2.0核心的Javascript服务有角,并试图整合NG-引导.

我安装了ng-bootstrap:

npm install --save @ng-bootstrap/ng-bootstrap

我把它添加到webpack.config.vendor.js:

...
const treeShakableModules = [
    '@angular/animations',
    '@angular/common',
    '@angular/compiler',
    '@angular/core',
    '@angular/forms',
    '@angular/http',
    '@angular/platform-browser',
    '@angular/platform-browser-dynamic',
    '@angular/router',
    '@ng-bootstrap/ng-bootstrap',  // <-- down here
    'zone.js',
];
...

我添加NgbModule到我的导入app.module.shared.ts:

...
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
...
@NgModule({
    declarations: [
        AppComponent,
        ...
    ],
    imports: [
        CommonModule,
        NgbModule.forRoot(),  // <-- this guy
        HttpModule,
        FormsModule,
        RouterModule.forRoot([
            ...
        ])
    ]
})
export class AppModuleShared {
}

我清理解决方案并运行:

c:\...>webpack && webpack --config webpack.config.vendor.js

一切都很好.

运行:

c:\...>dotnet run

尝试加载页面会导致以下错误:

NodeInvocationException:预渲染在30000ms后超时,因为'ClientApp/dist/main-server'中的启动函数返回了未解析或拒绝的承诺.

这显然与预渲染有关.所以我目前正在尝试创建一个ng-bootstrap仅使用我想要使用的组件的模型,它不会调用任何promise(或者将使用立即解析的伪promises),并且不会调用DOM.这将导入app.module.server.ts...

import { NgbModule } from './components/ng-bootstrap-mockup/ng-bootstrap'

......和标准 ......

import { NgbModule } from '@ng-bootstrap/ng-bootstrap'

...将用于app.module.browser.ts,而不是使用标准中app.module.shared.ts.

这些当然都会在各自的app模块中导入......

@NgModule({
    ...
    imports: [
        NgbModule.forRoot(),
        ...
    ]
})
...

所以我的问题是,我错过了什么吗？除了创建一个像我上面描述的那样的模型之外,还有更好的方法来解决这个问题吗？