basic webpack setup

demo-shell-ng2/config/helpers.js

@@ -0,0 +1,7 @@
+var path = require('path');
+var _root = path.resolve(__dirname, '..');
+function root(args) {
+  args = Array.prototype.slice.call(arguments, 0);
+  return path.join.apply(path, [_root].concat(args));
+}
+exports.root = root;

demo-shell-ng2/config/karma-test-shim.js

@@ -0,0 +1,21 @@
+Error.stackTraceLimit = Infinity;
+
+require('core-js/es6');
+require('core-js/es7/reflect');
+
+require('zone.js/dist/zone');
+require('zone.js/dist/long-stack-trace-zone');
+require('zone.js/dist/proxy');
+require('zone.js/dist/sync-test');
+require('zone.js/dist/jasmine-patch');
+require('zone.js/dist/async-test');
+require('zone.js/dist/fake-async-test');
+
+var appContext = require.context('../src', true, /\.spec\.ts/);
+
+appContext.keys().forEach(appContext);
+
+var testing = require('@angular/core/testing');
+var browser = require('@angular/platform-browser-dynamic/testing');
+
+testing.TestBed.initTestEnvironment(browser.BrowserDynamicTestingModule, browser.platformBrowserDynamicTesting());

demo-shell-ng2/config/karma.conf.js

@@ -0,0 +1,37 @@
+var webpackConfig = require('./webpack.test');
+
+module.exports = function (config) {
+  var _config = {
+    basePath: '',
+
+    frameworks: ['jasmine'],
+
+    files: [
+      { pattern: './config/karma-test-shim.js', watched: false }
+    ],
+
+    preprocessors: {
+      './config/karma-test-shim.js': ['webpack', 'sourcemap']
+    },
+
+    webpack: webpackConfig,
+
+    webpackMiddleware: {
+      stats: 'errors-only'
+    },
+
+    webpackServer: {
+      noInfo: true
+    },
+
+    reporters: ['progress'],
+    port: 9876,
+    colors: true,
+    logLevel: config.LOG_INFO,
+    autoWatch: false,
+    browsers: ['PhantomJS'],
+    singleRun: true
+  };
+
+  config.set(_config);
+};

demo-shell-ng2/config/webpack.common.js

@@ -0,0 +1,83 @@
+var webpack = require('webpack');
+var HtmlWebpackPlugin = require('html-webpack-plugin');
+var ExtractTextPlugin = require('extract-text-webpack-plugin');
+var helpers = require('./helpers');
+
+module.exports = {
+  entry: {
+    // 'polyfills': './src/polyfills.ts',
+    'polyfills': './app/polyfills.ts',
+    // 'vendor': './src/vendor.ts',
+    'vendor': './app/vendor.ts',
+    // 'app': './src/main.ts'
+    'app': './app/main.ts'
+  },
+
+  resolve: {
+    extensions: ['', '.ts', '.js'],
+    modules: [
+      // helpers.root('src'),
+      helpers.root('app'),
+      helpers.root('node_modules')
+    ]
+  },
+
+  module: {
+    loaders: [
+      {
+        test: /\.ts$/,
+        loaders: ['awesome-typescript-loader', 'angular2-template-loader'],
+        exclude: /node_modules/
+      },
+      {
+        test: /\.js$/,
+        include: [
+          helpers.root('node_modules', 'angular2-webpack-lib')
+        ],
+        loader: 'angular2-template-loader',
+      },
+      {
+        test: /\.html$/,
+        loader: 'html'
+      },
+      {
+        test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
+        loader: 'file?name=assets/[name].[hash].[ext]'
+      },
+      {
+        test: /\.css$/,
+        exclude: [
+          // helpers.root('src', 'app'),
+          helpers.root('app'),
+          helpers.root('node_modules', 'angular2-webpack-lib')
+        ],
+        loader: ExtractTextPlugin.extract('style', 'css?sourceMap')
+      },
+      {
+        test: /\.css$/,
+        include: [
+          // helpers.root('src', 'app'),
+          helpers.root('app'),
+          helpers.root('node_modules', 'angular2-webpack-lib')
+        ],
+        loader: 'raw'
+      }
+    ]
+  },
+
+  plugins: [
+    new webpack.optimize.CommonsChunkPlugin({
+      name: ['app', 'vendor', 'polyfills']
+    }),
+
+    new HtmlWebpackPlugin({
+      // template: 'src/index.html'
+      template: 'index.html'
+    })
+  ],
+
+  node: {
+      fs: 'empty',
+      module: false
+  }
+};

demo-shell-ng2/config/webpack.dev.js

@@ -0,0 +1,25 @@
+var webpackMerge = require('webpack-merge');
+var ExtractTextPlugin = require('extract-text-webpack-plugin');
+var commonConfig = require('./webpack.common.js');
+var helpers = require('./helpers');
+
+module.exports = webpackMerge(commonConfig, {
+  devtool: 'cheap-module-eval-source-map',
+
+  output: {
+    path: helpers.root('dist'),
+    // publicPath: 'http://localhost:8080/',
+    publicPath: 'http://localhost:3000/',
+    filename: '[name].js',
+    chunkFilename: '[id].chunk.js'
+  },
+
+  plugins: [
+    new ExtractTextPlugin('[name].css')
+  ],
+
+  devServer: {
+    historyApiFallback: true,
+    stats: 'minimal'
+  }
+});

demo-shell-ng2/config/webpack.prod.js

@@ -0,0 +1,38 @@
+var webpack = require('webpack');
+var webpackMerge = require('webpack-merge');
+var ExtractTextPlugin = require('extract-text-webpack-plugin');
+var commonConfig = require('./webpack.common.js');
+var helpers = require('./helpers');
+
+const ENV = process.env.NODE_ENV = process.env.ENV = 'production';
+
+module.exports = webpackMerge(commonConfig, {
+  devtool: 'source-map',
+
+  output: {
+    path: helpers.root('dist'),
+    publicPath: '/',
+    filename: '[name].[hash].js',
+    chunkFilename: '[id].[hash].chunk.js'
+  },
+
+  htmlLoader: {
+    minimize: false // workaround for ng2
+  },
+
+  plugins: [
+    new webpack.NoErrorsPlugin(),
+    new webpack.optimize.DedupePlugin(),
+    new webpack.optimize.UglifyJsPlugin({ // https://github.com/angular/angular/issues/10618
+      mangle: {
+        keep_fnames: true
+      }
+    }),
+    new ExtractTextPlugin('[name].[hash].css'),
+    new webpack.DefinePlugin({
+      'process.env': {
+        'ENV': JSON.stringify(ENV)
+      }
+    })
+  ]
+});

demo-shell-ng2/config/webpack.test.js

@@ -0,0 +1,37 @@
+var helpers = require('./helpers');
+
+module.exports = {
+  devtool: 'inline-source-map',
+
+  resolve: {
+    extensions: ['', '.ts', '.js']
+  },
+
+  module: {
+    loaders: [
+      {
+        test: /\.ts$/,
+        loaders: ['awesome-typescript-loader', 'angular2-template-loader']
+      },
+      {
+        test: /\.html$/,
+        loader: 'html'
+
+      },
+      {
+        test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
+        loader: 'null'
+      },
+      {
+        test: /\.css$/,
+        exclude: helpers.root('src', 'app'),
+        loader: 'null'
+      },
+      {
+        test: /\.css$/,
+        include: helpers.root('src', 'app'),
+        loader: 'raw'
+      }
+    ]
+  }
+}