Using CDN files with Angular2 and Webpack

So, I was wondering if there is a way to include CDN files with the webpack package. I looked around and have difficulty setting up a small Angular2 repository that does not throw errors with the Typescript transpiler (using CDN and without Systemjs). At the bottom of my index.html, I have various Angular2 dependencies included from cdn.js, for example:

<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-->

I usually use webpack, I understand that it would look at the node_modules that I installed and then linked in app.js, as I pointed out below:

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/
    }]
  }
};

My tsconfig.json for reference:

{
  "compilerOptions": {
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "module": "commonjs",
    "removeComments": true,
    "sourceMap": false
  },
  "exclude": [
      "node_modules"
  ]
}

, Typescript app.js. node_modules js CDN. , , , Angular2 cdn, ​​: Uncaught Error: Cannot find module "angular2/platform/browser".

!

+4
1

CDN , . webpack require, , :

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

, , angular.platform.browser , CDN angular

: https://webpack.imtqy.com/docs/library-and-externals.html

+1

Source: https://habr.com/ru/post/1625021/


All Articles