我在想是否有一种方法可以将CDN文件与webpack捆绑包一起使用。我一直在寻找解决方案,尝试搭建一个小型Angular2仓库,但是没有使用Systemjs的情况下,无法避免Typescript编译器出错。在我的index.html底部,我从cdn.js中包含了各种Angular2依赖项,如下所示:
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.0/angular2-polyfills.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.0/Rx.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.0/angular2.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.0/http.min.js"></script>
<script src="js/app.js"></script><!--bundle from webpack-->
通常情况下,使用webpack时,它会查找我安装的node_modules,然后按照我下面指定的方式将它们捆绑到app.js中:
var webpack = require('webpack');
module.exports = {
entry: "./src/typescript/app",
devtool: 'source-map',
output: {
path: __dirname + "/app/js", publicPath: 'app/js', filename: "app.js"
},
resolve: {
extensions: ['', '.js', '.ts']
},
module: {
loaders: [{
test: /\.ts/, loaders: ['ts-loader'], exclude: /node_modules/
}]
}
};
这是我的 tsconfig.json 文件供您参考:
{
"compilerOptions": {
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "es5",
"module": "commonjs",
"removeComments": true,
"sourceMap": false
},
"exclude": [
"node_modules"
]
}
然而,对于这段代码,我只想将仅仅我的Typescript文件转换成一个
app.js
文件进行连接。我希望忽略掉node_modules并让来自上面CDN的js文件被使用。然而,我仍然不确定如何让我的bundle知道angular2是从cdn中包含的,因为它会给我一个错误,就像这样:Uncaught Error: Cannot find module "angular2/platform/browser"
。感激任何帮助!