client/config/webpack.prod.js

   1 /**
   2  * @author: @AngularClass
   3  */
   4
   5 const helpers = require('./helpers')
   6 const webpackMerge = require('webpack-merge') // used to merge webpack configs
   7 const commonConfig = require('./webpack.common.js') // the settings that are common to prod and dev
   8
   9 /**
  10  * Webpack Plugins
  11  */
  12 const DefinePlugin = require('webpack/lib/DefinePlugin')
  13 const LoaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin')
  14 const NormalModuleReplacementPlugin = require('webpack/lib/NormalModuleReplacementPlugin')
  15 const OptimizeJsPlugin = require('optimize-js-plugin')
  16 const UglifyJsPlugin = require('webpack/lib/optimize/UglifyJsPlugin')
  17 const WebpackMd5Hash = require('webpack-md5-hash')
  18
  19 /**
  20  * Webpack Constants
  21  */
  22 const ENV = process.env.NODE_ENV = process.env.ENV = 'production'
  23 const HOST = process.env.HOST || 'localhost'
  24 const PORT = process.env.PORT || 8080
  25 const METADATA = webpackMerge(commonConfig({env: ENV}).metadata, {
  26   host: HOST,
  27   port: PORT,
  28   ENV: ENV,
  29   HMR: false
  30 })
  31
  32 module.exports = function (env) {
  33   return webpackMerge(commonConfig({env: ENV}), {
  34     /**
  35     * Developer tool to enhance debugging
  36     *
  37     * See: http://webpack.github.io/docs/configuration.html#devtool
  38     * See: https://github.com/webpack/docs/wiki/build-performance#sourcemaps
  39     */
  40     devtool: 'source-map',
  41
  42     /**
  43     * Options affecting the output of the compilation.
  44     *
  45     * See: http://webpack.github.io/docs/configuration.html#output
  46     */
  47     output: {
  48
  49       /**
  50       * The output directory as absolute path (required).
  51       *
  52       * See: http://webpack.github.io/docs/configuration.html#output-path
  53       */
  54       path: helpers.root('dist'),
  55
  56       /**
  57       * Specifies the name of each output file on disk.
  58       * IMPORTANT: You must not specify an absolute path here!
  59       *
  60       * See: http://webpack.github.io/docs/configuration.html#output-filename
  61       */
  62       filename: '[name].[chunkhash].bundle.js',
  63
  64       /**
  65       * The filename of the SourceMaps for the JavaScript files.
  66       * They are inside the output.path directory.
  67       *
  68       * See: http://webpack.github.io/docs/configuration.html#output-sourcemapfilename
  69       */
  70       sourceMapFilename: '[name].[chunkhash].bundle.map',
  71
  72       /**
  73       * The filename of non-entry chunks as relative path
  74       * inside the output.path directory.
  75       *
  76       * See: http://webpack.github.io/docs/configuration.html#output-chunkfilename
  77       */
  78       chunkFilename: '[id].[chunkhash].chunk.js',
  79
  80       publicPath: '/client/'
  81     },
  82
  83     externals: {
  84       webtorrent: 'WebTorrent'
  85     },
  86
  87     /**
  88      * Add additional plugins to the compiler.
  89      *
  90      * See: http://webpack.github.io/docs/configuration.html#plugins
  91      */
  92     plugins: [
  93
  94       /**
  95        * Plugin: WebpackMd5Hash
  96        * Description: Plugin to replace a standard webpack chunkhash with md5.
  97        *
  98        * See: https://www.npmjs.com/package/webpack-md5-hash
  99        */
 100       new WebpackMd5Hash(),
 101
 102       /**
 103        * Webpack plugin to optimize a JavaScript file for faster initial load
 104        * by wrapping eagerly-invoked functions.
 105        *
 106        * See: https://github.com/vigneshshanmugam/optimize-js-plugin
 107        */
 108
 109       new OptimizeJsPlugin({
 110         sourceMap: false
 111       }),
 112
 113       /**
 114        * Plugin: DedupePlugin
 115        * Description: Prevents the inclusion of duplicate code into your bundle
 116        * and instead applies a copy of the function at runtime.
 117        *
 118        * See: https://webpack.github.io/docs/list-of-plugins.html#defineplugin
 119        * See: https://github.com/webpack/docs/wiki/optimization#deduplication
 120        */
 121       // new DedupePlugin(),
 122
 123       /**
 124        * Plugin: DefinePlugin
 125        * Description: Define free variables.
 126        * Useful for having development builds with debug logging or adding global constants.
 127        *
 128        * Environment helpers
 129        *
 130        * See: https://webpack.github.io/docs/list-of-plugins.html#defineplugin
 131        */
 132       // NOTE: when adding more properties make sure you include them in custom-typings.d.ts
 133       new DefinePlugin({
 134         'ENV': JSON.stringify(METADATA.ENV),
 135         'HMR': METADATA.HMR,
 136         'process.env': {
 137           'ENV': JSON.stringify(METADATA.ENV),
 138           'NODE_ENV': JSON.stringify(METADATA.ENV),
 139           'HMR': METADATA.HMR
 140         }
 141       }),
 142 /**
 143       * Plugin: UglifyJsPlugin
 144       * Description: Minimize all JavaScript output of chunks.
 145       * Loaders are switched into minimizing mode.
 146       *
 147       * See: https://webpack.github.io/docs/list-of-plugins.html#uglifyjsplugin
 148       */
 149       // NOTE: To debug prod builds uncomment //debug lines and comment //prod lines
 150       new UglifyJsPlugin({
 151         // beautify: true, //debug
 152         // mangle: false, //debug
 153         // dead_code: false, //debug
 154         // unused: false, //debug
 155         // deadCode: false, //debug
 156         // compress: {
 157         //   screw_ie8: true,
 158         //   keep_fnames: true,
 159         //   drop_debugger: false,
 160         //   dead_code: false,
 161         //   unused: false
 162         // }, // debug
 163         // comments: true, //debug
 164
 165         beautify: false, // prod
 166         output: {
 167           comments: false
 168         }, // prod
 169         mangle: {
 170           screw_ie8: true
 171         }, // prod
 172         compress: {
 173           screw_ie8: true,
 174           warnings: false,
 175           conditionals: true,
 176           unused: true,
 177           comparisons: true,
 178           sequences: true,
 179           dead_code: true,
 180           evaluate: true,
 181           if_return: true,
 182           join_vars: true,
 183           negate_iife: false // we need this for lazy v8
 184         }
 185       }),
 186
 187       new NormalModuleReplacementPlugin(
 188         /angular2-hmr/,
 189         helpers.root('config/empty.js')
 190       ),
 191
 192       new NormalModuleReplacementPlugin(
 193         /zone\.js(\\|\/)dist(\\|\/)long-stack-trace-zone/,
 194         helpers.root('config/empty.js')
 195       ),
 196
 197       // AoT
 198       // new NormalModuleReplacementPlugin(
 199       //   /@angular(\\|\/)upgrade/,
 200       //   helpers.root('config/empty.js')
 201       // ),
 202       // new NormalModuleReplacementPlugin(
 203       //   /@angular(\\|\/)compiler/,
 204       //   helpers.root('config/empty.js')
 205       // ),
 206       // new NormalModuleReplacementPlugin(
 207       //   /@angular(\\|\/)platform-browser-dynamic/,
 208       //   helpers.root('config/empty.js')
 209       // ),
 210       // new NormalModuleReplacementPlugin(
 211       //   /dom(\\|\/)debug(\\|\/)ng_probe/,
 212       //   helpers.root('config/empty.js')
 213       // ),
 214       // new NormalModuleReplacementPlugin(
 215       //   /dom(\\|\/)debug(\\|\/)by/,
 216       //   helpers.root('config/empty.js')
 217       // ),
 218       // new NormalModuleReplacementPlugin(
 219       //   /src(\\|\/)debug(\\|\/)debug_node/,
 220       //   helpers.root('config/empty.js')
 221       // ),
 222       // new NormalModuleReplacementPlugin(
 223       //   /src(\\|\/)debug(\\|\/)debug_renderer/,
 224       //   helpers.root('config/empty.js')
 225       // ),
 226
 227       /**
 228       * Plugin: IgnorePlugin
 229       * Description: Don’t generate modules for requests matching the provided RegExp.
 230       *
 231       * See: http://webpack.github.io/docs/list-of-plugins.html#ignoreplugin
 232       */
 233
 234       // new IgnorePlugin(/angular2-hmr/),
 235
 236       /**
 237       * Plugin: CompressionPlugin
 238       * Description: Prepares compressed versions of assets to serve
 239       * them with Content-Encoding
 240       *
 241       * See: https://github.com/webpack/compression-webpack-plugin
 242       */
 243       //  install compression-webpack-plugin
 244       // new CompressionPlugin({
 245       //   regExp: /\.css$|\.html$|\.js$|\.map$/,
 246       //   threshold: 2 * 1024
 247       // })
 248
 249       /**
 250       * Plugin LoaderOptionsPlugin (experimental)
 251       *
 252       * See: https://gist.github.com/sokra/27b24881210b56bbaff7
 253       */
 254       new LoaderOptionsPlugin({
 255         debug: false,
 256         options: {
 257
 258           /**
 259           * Static analysis linter for TypeScript advanced options configuration
 260           * Description: An extensible linter for the TypeScript language.
 261           *
 262           * See: https://github.com/wbuchwalter/tslint-loader
 263           */
 264           tslint: {
 265             emitErrors: true,
 266             failOnHint: true,
 267             resourcePath: 'src'
 268           },
 269
 270           /**
 271           * Html loader advanced options
 272           *
 273           * See: https://github.com/webpack/html-loader#advanced-options
 274           */
 275           // TODO: Need to workaround Angular 2's html syntax => #id [bind] (event) *ngFor
 276           htmlLoader: {
 277             minimize: true,
 278             removeAttributeQuotes: false,
 279             caseSensitive: true,
 280             customAttrSurround: [
 281               [/#/, /(?:)/],
 282               [/\*/, /(?:)/],
 283               [/\[?\(?/, /(?:)/]
 284             ],
 285             customAttrAssign: [/\)?]?=/]
 286           },
 287
 288           // FIXME: Remove
 289           // https://github.com/bholloway/resolve-url-loader/issues/36
 290           // https://github.com/jtangelder/sass-loader/issues/289
 291           context: __dirname,
 292           output: {
 293             path: helpers.root('dist')
 294           }
 295         }
 296       })
 297     ],
 298
 299     /*
 300     * Include polyfills or mocks for various node stuff
 301     * Description: Node configuration
 302     *
 303     * See: https://webpack.github.io/docs/configuration.html#node
 304     */
 305     node: {
 306       global: true,
 307       crypto: 'empty',
 308       process: false,
 309       module: false,
 310       clearImmediate: false,
 311       setImmediate: false
 312     }
 313
 314   })
 315 }