我想做一个简单的Webpack版本的Angular 2 5 min quickstart tutorial。如何使webpack排除angular2模块
由于它的may be problematic to just let Webpack autmatically include all modules needed,我包括直接来自html的供应商脚本,几乎就像教程,除了我不需要system.js的webpack安装程序,所以我不包括,但我确实需要的 “bundle.js”,它的WebPack生产:
<body>
<my-app></my-app>
<script src="node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="node_modules/rxjs/bundles/Rx.js"></script>
<script src="node_modules/angular2/bundles/angular2.dev.js"></script>
<script src="bundle.js"></script>
</body>
如果我使用这个配置对的WebPack,我几乎都达到我的目标:
module.exports = {
entry: './src/boot.ts',
output: {
filename: 'bundle.js'
},
devtool: 'source-map',
resolve: {
extensions: ['', '.ts', '.js']
},
module: {
loaders: [
{ test: /\.ts$/, exclude: [/angular2/], loader: 'ts-loader' }
],
noParse: [/angular2/]
}
};
没有noParse,会的WebPack包括223个模块,它本身就是它应该的,但出于某种奇怪的原因这会导致一个有问题的巨大捆绑文件(请参阅上面的链接)。随着noParse我快达到我的目标,但不是完全,但它仍然包括我不想的WebPack包括两个角模块:
[0] ./src/boot.ts 195 bytes {0} [built]
[1] ./~/angular2/platform/browser.js 13.1 kB {0} [built]
[2] ./src/myapp/components/myapp.ts 1.27 kB {0} [built]
[3] ./~/angular2/core.js 4.54 kB {0} [built]
我不想的WebPack包括任何角2个模块(如我已经包括了这一点)。这可能是因为我的两个自制模块使用了这两个模块。但我怎么能让webpack忽略这些?我noParse
(或exclude
)是没有帮助这里...
参考此链接。尽管它使用Visual Studio 2015,但任何编辑器都可以使用相同的技术http://www.mithunvp.com/angular-2-in-asp-net-5-typescript-visual-studio-2015/ –