Webpack config

webpack-development.config.js

module.exports = require("./webpack.make-config")({
  styleguide: true,
  mocks: true,
  debug: true,
  devel: true
});

webpack-production.config.js

module.exports = require("./webpack.make-config")({
  optimize: true,
  extractStyles: true
});

webpack.make-config.js

// https://github.com/Foxandxss/angular-webpack-workflow

var path = require('path');
var webpack = require("webpack");
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var WebpackNotifierPlugin = require('webpack-notifier');


var basePath = path.join(__dirname, "client");

function makeWebpackConfig(options) {
  var config = {
    context: path.join(basePath, "app"),
    entry: {
      app: ['./app.ts'], // app.js

      vendor: [
        'angular',
        'angular-animate',
        'angular-cookies',
        'angular-dynamic-locale',
        'angular-messages',
        'angular-sanitize',
        'angular-touch',
        'angular-translate',
        'angular-translate-loader-static-files',
        'angular-ui-bootstrap',
        'angular-ui-router',
        'angular-ui-scrollpoint',
        'angular-validation-match',
        'eventemitter2',
        'lodash',
        'moment',
        'ngstorage',
        'node-uuid',
        'svg-injector',
        'tether'
      ]
    },
    output: {
      path: path.join(basePath, "dist"),
      filename: '[name].bundle.js'
    },


    // http://webpack.github.io/docs/configuration.html#devtool
    devtool: 'source-map',

    stats: { children: false },

    module: {
      loaders: [
  	    { test:/\.ts$/, loader: 'ts-loader' },
        { test: /\.partial.html$/, loader: 'file?name=[path][name].[ext]' },
        { test: /^((?!partial).)*\.html$/, loader: 'html' },
        { test: /\.css$/, loader: 'style!css' },

        // Mantener siempre esta ruta destino, en necesaria por el componente del locale
        { test: /locale-.*\.json$/, loader: 'file?name=i18n/[name].[ext]' },

        { test: /\.scss$/,
          loader: ExtractTextPlugin.extract(
            'style',
            'css!autoprefixer?{browsers:["last 2 version", "> 1%", "ie >= 9", "Opera 12.1"]}!sass') },

        // Añade en línea el sprite de svg de iconos
        { test: /\.inline\.svg$/i, loader: 'inline' },

        // Copia a la carpeta del bundle las imágenes relacionadas en html y css
        { test: /\.(png|jpg|jpeg|svg)$/, loader: 'file?name=[path][name].[ext]', exclude: [/\.inline\.svg$/i] },

        // Procesa los ficheros en ES6
        { test: /\.js$/, loader: 'babel', exclude: [/client\/lib/, /node_modules/, /\.spec\.js/] },

        // Mantener siempre esta ruta destino, es necesaria por el componente de idioma
        { test: /angular-locale_.*\.js$/, loader: 'file?name=locale/[name].[ext]' },

        // Procesa los ficheros de fuentes
        { test: /\.(woff2|woff|ttf|eot)$/,   loader: 'file?name=[path][name].[ext]' }
      ]
    },

    plugins: [
      new webpack.DefinePlugin({
        LK_MOCKS: options.mocks,
        DEBUG_INFO: options.debug
      }),
      new HtmlWebpackPlugin({
        template: path.join(basePath, 'app/index.html')
      }),
      new webpack.optimize.CommonsChunkPlugin('vendor', 'vendor.bundle.js'),
      new ExtractTextPlugin('[name].css', {
        disable: !options.extractStyles
      }),
    ],

    resolve: {
      extensions: ['', '.webpack.js', '.web.js', '.ts', '.tsx', '.js'],
      alias: {
        'ControllerBase': path.join(basePath, 'app/core/base.controller.js'),
        'StoreBase': path.join(basePath, 'app/core/base.store.ts'),
        'BaseEntity': path.join(basePath, 'app/core/base.entity.ts'),
      },
    }
  };

  if (options.styleguide) {
    config.entry.styleguide = ['./styleguide.ts']
  }

  if (options.devel) {
    config.plugins.push(
      new webpack.HotModuleReplacementPlugin(),
      new WebpackNotifierPlugin()
    );
  }

  if (options.optimize) {
    config.plugins.push(
      new webpack.optimize.OccurrenceOrderPlugin(true),
      new webpack.optimize.UglifyJsPlugin({
        compress: {
          warnings: false
        }
      }),
      new webpack.NoErrorsPlugin()
    );
  }

  return config;
}

module.exports = makeWebpackConfig;