Использование CDN-файлов с Angular2 и Webpack

Question

Так что мне было интересно, есть ли способ включить CDN-файлы вместе с пакетом webpack. Я оглядывался вокруг и испытываю трудности с настройкой небольшого ретранслятора Angular2, который не выдает ошибок с транспилером Typcript (с использованием CDN и без Systemjs). В нижней части моей index.html, у меня есть различные зависимости от Angular2 включены из cdn.js так:

<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" 
    ] 
} 

Однако для этого кода, я только хочу, чтобы transpile затем concatenate только мои файлы машинописных файлов в один файл app.js. Я хочу игнорировать node_modules и вместо этого использовать js-файлы из CDN. Тем не менее, я все еще смущен тем, как сообщить своему узлу, что angular2 был включен из cdn, потому что он дает мне такую ​​ошибку: Uncaught Error: Cannot find module "angular2/platform/browser".

Любая помощь будет оценена!

Answer 1

CDN-файлы обычно загрязняют окно с переменной, которая должна быть доступна. Вы можете перенаправить Webpack require заявления, чтобы забрать вещи прочь окна, например:

// webpack.config.js 
module.exports = { 
    externals: { 
    'angular2/platform/browser': 'angular.platform.browser' 
    } 
    ... 
}; 

Конечно, я ожидаю, что вы изменить angular.platform.browser к любой глобальной переменной вы хотите использовать от версии CDN углового

Больше

Вот соответствующие документы: https://webpack.github.io/docs/library-and-externals.html