网页包2未加载Angular2 Typescript应用程序的导入

我正在尝试在一个使用typescript的中型angular2项目上实现webpack。但当我运行webpack时，它只绑定了我在配置文件中指定的2个文件。它从不遍历导入树并加载其余模块

我有一个相当简单的配置设置。我想让它只是捆绑的打字脚本开始。然后我将继续绑定更多文件

当我将import{}从“x”语法更改为var{}=require（“x”）时。然而，webpack工作时会抛出数百个错误，因为它无法解析从@angular2目录导入的任何内容

如何让webpack遍历“import”语句并将多个文件捆绑到结果中

我的配置如下

webpack.config.js

var webpack = require('webpack');
var path = require('path');

module.exports = {
    context: path.join(__dirname, 'wwwroot/app'),
    entry: {
        'vendor': './vendor',
        'app': './main'
    },
    resolve: {
        extensions: ['', '.ts', '.js']
    },
    output: {
        path: path.join(__dirname, 'wwwroot/built'),
        filename: '[name].bundle.js'
    },
    module: {
        loaders: [
            {
                test: /\.ts$/,
                exclude: /node_modules/,
                loaders: ['ts', 'angular2-template-loader']
            }
        ]
    }
};

tsconfig.json

{
  "compilerOptions": {
    "noImplicitAny": false,
    "removeComments": false,
    "sourceMap": true,
    "target": "es5",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "module": "system",
    "moduleResolution": "node"
  },
  "exclude": [
    "node_modules",
    "wwwroot/lib",
    "bin"
  ]
}

梅因酒店

import { bootstrap } from '@angular/platform-browser-dynamic';
import { HTTP_PROVIDERS } from '@angular/http';
import { disableDeprecatedForms, provideForms } from '@angular/forms';

import { AppComponent } from './app.component';
import { APP_ROUTER_PROVIDERS } from './app.routes';

bootstrap(AppComponent, [
    APP_ROUTER_PROVIDERS,
    HTTP_PROVIDERS,
    disableDeprecatedForms(),
    provideForms()
]).catch(err => console.error(err));

正在运行的Web包上的控制台输出：

10% building modules 0/2 modules 2 active ...\src\wwwroot\app\main.tsts-loader: Using typescript@1.8.10 and C:\BitBucket\src\tsconfig.json
8831ms building modules
1ms sealing
1ms optimizing
0ms basic module optimization
1ms module optimization
1ms advanced module optimization
0ms basic chunk optimization
0ms chunk optimization
1ms advanced chunk optimization
0ms module and chunk tree optimization
1ms module reviving
0ms module order optimization
1ms module id optimization
1ms chunk reviving
0ms chunk order optimization
1ms chunk id optimization
8ms hashing
0ms module assets processing
5ms chunk assets processing
4ms additional chunk assets processing
2ms recording
0ms additional asset processing
1ms chunk asset optimization
1648ms asset optimization
10ms emitting
Hash: 8a864382625d5d236939
Version: webpack 2.1.0-beta.21
Time: 10640ms
           Asset     Size  Chunks             Chunk Names
vendor.bundle.js  3.21 kB       0  [emitted]  vendor
   app.bundle.js  3.81 kB       1  [emitted]  app
    + 2 hidden modules

---

尝试将

模块

从

系统

更改为

commonjs

，如下所示：

{
  "compilerOptions": {
    "noImplicitAny": false,
    "removeComments": false,
    "sourceMap": true,
    "target": "es5",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "module": "commonjs", // <--- from 'system' to 'commonjs'
    "moduleResolution": "node"
  },
  "exclude": [
    "node_modules",
    "wwwroot/lib",
    "bin"
  ]
}

{
“编译器选项”：{
“noImplicitAny”：错，
“removeComments”：false，
“源地图”：正确，
“目标”：“es5”，
“emit decoromentadata”：正确，
“实验生态学者”：没错，
“module”：“commonjs”，//我注意到TSCONFIG中的typescript模块设置为“system”。是否考虑使用“es6”来代替？您是否考虑过使用awesome typescript loader来代替ts loader？