不能在Webpack和Angular2上使用ng-bootstrap

Question

首先我安裝並導入了NgbModule ：

• npm install --save @ng-bootstrap/ng-bootstrap
• import {NgbModule} from '@ng-bootstrap/ng-bootstrap'

在這一點上，一切正常，我能夠像ng-bootstrap之前那樣運行我的應用ng-bootstrap

當我加入NgbModule到imports我的陣列NgModule ，如下所述：

@NgModule({
    imports: [
        NgbModule, ....
    ],
    declarations: [AppComponent, ....],
    bootstrap: [AppComponent],
})

我無法使用webpack-dev-server運行npm start ，因為它喊道：

這是我的webpack.config.js ：

module.exports = {
  entry: "./app/boot",
  output: {
    path: __dirname,
    filename: "./dist/bundle.js"
  },
  resolve: {
    extensions: ['', '.js', '.ts']
  },
  module: {
    loaders: [
      { test: /\.ts/,   loader: ["ts-loader"], exclude: /node_modules/ },
     ],
     preLoaders: [
      // All output '.js' files will have any sourcemaps re-processed by 'source-map-loader'.
      { test: /\.js$/, loader: "source-map-loader", exclude: ['node_modules', 'ext-*', 'lib', 'tools'] }
    ]
  },
  debug: true,
  devtool: 'source-map'
};

任何幫助和解釋將不勝感激！

提前致謝！

更新：

從preLoaders刪除source-map-loader的preLoaders會消除錯誤，但在瀏覽器中不會產生Typescript源。

知道該怎么辦？ 為什么會這樣？

Answer 1

看起來webpack在您的本地計算機文件中搜索source-map-loader而不是在您的項目中。 因此我的猜測是npm install source-map-loader --save-dev將無效。

當從本地PC而不是從您的項目詢問某個模塊時，它可能是一個應該全局安裝的模塊。

嘗試： npm install source-map-loader -g

Answer 2

是否安裝了source-map-loader模塊，即它是否在node_modules文件夾中？ 如果沒有使用此命令安裝它：

npm install source-map-loader --save-dev