client/config/webpack.dev.js

   1 const helpers = require('./helpers')
   2 const webpackMerge = require('webpack-merge') // used to merge webpack configs
   3 const commonConfig = require('./webpack.common.js') // the settings that are common to prod and dev
   4
   5 /**
   6  * Webpack Plugins
   7  */
   8 const DefinePlugin = require('webpack/lib/DefinePlugin')
   9 const NamedModulesPlugin = require('webpack/lib/NamedModulesPlugin')
  10 const LoaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin')
  11
  12 /**
  13  * Webpack Constants
  14  */
  15 const ENV = process.env.ENV = process.env.NODE_ENV = 'development'
  16 const HOST = process.env.HOST || 'localhost'
  17 const PORT = process.env.PORT || 3000
  18 const HMR = helpers.hasProcessFlag('hot')
  19 const METADATA = webpackMerge(commonConfig({env: ENV}).metadata, {
  20   host: HOST,
  21   port: PORT,
  22   ENV: ENV,
  23   HMR: HMR
  24 })
  25
  26 /**
  27  * Webpack configuration
  28  *
  29  * See: http://webpack.github.io/docs/configuration.html#cli
  30  */
  31 module.exports = function (env) {
  32   return webpackMerge(commonConfig({env: ENV}), {
  33     /**
  34     * Developer tool to enhance debugging
  35     *
  36     * See: http://webpack.github.io/docs/configuration.html#devtool
  37     * See: https://github.com/webpack/docs/wiki/build-performance#sourcemaps
  38     */
  39     devtool: 'cheap-module-source-map',
  40
  41     /**
  42     * Options affecting the output of the compilation.
  43     *
  44     * See: http://webpack.github.io/docs/configuration.html#output
  45     */
  46     output: {
  47       /**
  48       * The output directory as absolute path (required).
  49       *
  50       * See: http://webpack.github.io/docs/configuration.html#output-path
  51       */
  52       path: helpers.root('dist'),
  53
  54       /**
  55       * Specifies the name of each output file on disk.
  56       * IMPORTANT: You must not specify an absolute path here!
  57       *
  58       * See: http://webpack.github.io/docs/configuration.html#output-filename
  59       */
  60       filename: '[name].bundle.js',
  61
  62       /**
  63       * The filename of the SourceMaps for the JavaScript files.
  64       * They are inside the output.path directory.
  65       *
  66       * See: http://webpack.github.io/docs/configuration.html#output-sourcemapfilename
  67       */
  68       sourceMapFilename: '[name].map',
  69
  70       /** The filename of non-entry chunks as relative path
  71       * inside the output.path directory.
  72       *
  73       * See: http://webpack.github.io/docs/configuration.html#output-chunkfilename
  74       */
  75       chunkFilename: '[id].chunk.js',
  76
  77       library: 'ac_[name]',
  78       libraryTarget: 'var',
  79
  80       publicPath: '/client/'
  81     },
  82
  83     externals: {
  84       webtorrent: 'WebTorrent'
  85     },
  86
  87     plugins: [
  88
  89       /**
  90       * Plugin: DefinePlugin
  91       * Description: Define free variables.
  92       * Useful for having development builds with debug logging or adding global constants.
  93       *
  94       * Environment helpers
  95       *
  96       * See: https://webpack.github.io/docs/list-of-plugins.html#defineplugin
  97       */
  98       // NOTE: when adding more properties, make sure you include them in custom-typings.d.ts
  99       new DefinePlugin({
 100         'ENV': JSON.stringify(METADATA.ENV),
 101         'HMR': METADATA.HMR,
 102         'process.env': {
 103           'ENV': JSON.stringify(METADATA.ENV),
 104           'NODE_ENV': JSON.stringify(METADATA.ENV),
 105           'HMR': METADATA.HMR
 106         }
 107       }),
 108
 109       /**
 110       * Plugin: NamedModulesPlugin (experimental)
 111       * Description: Uses file names as module name.
 112       *
 113       * See: https://github.com/webpack/webpack/commit/a04ffb928365b19feb75087c63f13cadfc08e1eb
 114       */
 115       new NamedModulesPlugin(),
 116
 117       /**
 118       * Plugin LoaderOptionsPlugin (experimental)
 119       *
 120       * See: https://gist.github.com/sokra/27b24881210b56bbaff7
 121       */
 122       new LoaderOptionsPlugin({
 123         debug: true,
 124         options: {
 125
 126           /**
 127           * Static analysis linter for TypeScript advanced options configuration
 128           * Description: An extensible linter for the TypeScript language.
 129           *
 130           * See: https://github.com/wbuchwalter/tslint-loader
 131           */
 132           tslint: {
 133             emitErrors: false,
 134             failOnHint: false,
 135             resourcePath: 'src'
 136           },
 137
 138           // FIXME: Remove
 139           // https://github.com/bholloway/resolve-url-loader/issues/36
 140           // https://github.com/jtangelder/sass-loader/issues/289
 141           context: __dirname,
 142           output: {
 143             path: helpers.root('dist')
 144           }
 145
 146         }
 147       })
 148
 149     ],
 150
 151     /**
 152     * Webpack Development Server configuration
 153     * Description: The webpack-dev-server is a little node.js Express server.
 154     * The server emits information about the compilation state to the client,
 155     * which reacts to those events.
 156     *
 157     * See: https://webpack.github.io/docs/webpack-dev-server.html
 158     */
 159     devServer: {
 160       port: METADATA.port,
 161       host: METADATA.host,
 162       historyApiFallback: true,
 163       watchOptions: {
 164         aggregateTimeout: 300,
 165         poll: 1000
 166       },
 167       outputPath: helpers.root('dist')
 168     },
 169
 170     /*
 171     * Include polyfills or mocks for various node stuff
 172     * Description: Node configuration
 173     *
 174     * See: https://webpack.github.io/docs/configuration.html#node
 175     */
 176     node: {
 177       global: true,
 178       crypto: 'empty',
 179       process: true,
 180       module: false,
 181       clearImmediate: false,
 182       setImmediate: false
 183     }
 184   })
 185 }