webpack.common.js

webpack.common.js

var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var helpers = require('./helpers');

const CONFIG_STORAGE_NAME = process.env.CONFIG_STORAGE_NAME = 'config';

module.exports = {
  entry: {
    'polyfills': './src/polyfills.ts',
    'vendor': './src/vendor.ts',
    'app': './src/main.ts',
  },

  resolve: {
    extensions: ['.js', '.ts', '.scss']
  },

  module: {
    rules: [
    {
      test: /\.html$/,
      use: 'html-loader?attrs=img:src div:inlineSVG'
    },
    {
      test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico|otf)$/,
      use: 'file-loader?name=assets/[name].[hash].[ext]'
    },
    {
      test: /\.scss$/,
      exclude: [helpers.root('src', 'app')],
      use: ExtractTextPlugin
      .extract({
        fallback: 'style-loader',
        use: [
        { loader: 'css-loader', query: { sourceMaps: true } },
        { loader: 'resolve-url-loader'},
        { loader: 'sass-loader'}
        ]
      })
    },
    {
      test: /\.scss$/,
      include: [helpers.root('src', 'app')],
      use: [
      { loader: 'raw-loader'},
      { loader: 'resolve-url-loader'},
      { loader: 'sass-loader'}
      ]
    }
    ]
  },
  plugins: [
  // Workaround for angular/angular#11580
  new webpack.ContextReplacementPlugin(
    /angular(\\|\/)core(\\|\/)@angular/,
    helpers.root('src'), // location of your src
    {
      // your Angular Async Route paths relative to this root directory
    }
    ),
  new webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /en|fr/),
  new webpack.DefinePlugin({
    'CONFIG_STORAGE_NAME' : JSON.stringify(CONFIG_STORAGE_NAME),
    'process.env': {
      'CONFIG_STORAGE_NAME' : JSON.stringify(CONFIG_STORAGE_NAME)
    }
  }),
  new webpack.optimize.CommonsChunkPlugin({
    names: ['app', 'vendor', 'polyfills']
  }),
  new HtmlWebpackPlugin({
    template: helpers.root('src', 'index.html')
  })
  ]
};