config.js 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  1. /**
  2. * React Static Boilerplate
  3. * https://github.com/koistya/react-static-boilerplate
  4. * Copyright (c) Konstantin Tarkus (@koistya) | MIT license
  5. */
  6. import path from 'path';
  7. import webpack from 'webpack';
  8. import merge from 'lodash/object/merge';
  9. const DEBUG = !process.argv.includes('release');
  10. const VERBOSE = process.argv.includes('verbose');
  11. const WATCH = global.watch;
  12. const SCRIPT_LOADERS = WATCH ? ['react-hot', 'babel'] : ['babel'];
  13. const AUTOPREFIXER_BROWSERS = [
  14. 'Android 2.3',
  15. 'Android >= 4',
  16. 'Chrome >= 20',
  17. 'Firefox >= 24',
  18. 'Explorer >= 8',
  19. 'iOS >= 6',
  20. 'Opera >= 12',
  21. 'Safari >= 6'
  22. ];
  23. // Base configuration
  24. const config = {
  25. output: {
  26. path: path.join(__dirname, '../build'),
  27. publicPath: '/',
  28. sourcePrefix: ' '
  29. },
  30. cache: false,
  31. debug: DEBUG,
  32. stats: {
  33. colors: true,
  34. reasons: DEBUG,
  35. hash: VERBOSE,
  36. version: VERBOSE,
  37. timings: VERBOSE,
  38. chunks: VERBOSE,
  39. chunkModules: VERBOSE,
  40. cached: VERBOSE,
  41. cachedAssets: VERBOSE
  42. },
  43. plugins: [
  44. new webpack.optimize.OccurenceOrderPlugin(),
  45. new webpack.DefinePlugin({
  46. 'process.env.NODE_ENV': DEBUG ? '"development"' : '"production"',
  47. '__DEV__': DEBUG
  48. })
  49. ],
  50. module: {
  51. loaders: [{
  52. test: /\.css$/,
  53. loader: 'style-loader/useable!' +
  54. 'css-loader' + (DEBUG ? '' : '/minimize') + '!postcss-loader'
  55. }, {
  56. test: /\.jsx?$/,
  57. include: [
  58. path.resolve(__dirname, '../src')
  59. ],
  60. loaders: SCRIPT_LOADERS
  61. }, {
  62. test: /[\\\/]app\.js$/,
  63. loader: path.join(__dirname, './lib/routes-loader.js')
  64. }, {
  65. test: /\.gif/,
  66. loader: 'url-loader?limit=10000&mimetype=image/gif'
  67. }, {
  68. test: /\.jpg/,
  69. loader: 'url-loader?limit=10000&mimetype=image/jpg'
  70. }, {
  71. test: /\.png/,
  72. loader: 'url-loader?limit=10000&mimetype=image/png'
  73. }, {
  74. test: /\.svg/,
  75. loader: 'url-loader?limit=10000&mimetype=image/svg+xml'
  76. }]
  77. },
  78. postcss: [
  79. require('cssnext')({ browsers: AUTOPREFIXER_BROWSERS }),
  80. require('postcss-nested')()
  81. ]
  82. };
  83. // Configuration for the client-side bundle
  84. const appConfig = merge({}, config, {
  85. entry: [
  86. ...(WATCH && ['webpack-hot-middleware/client']),
  87. './src/js/app.js'
  88. ],
  89. output: {
  90. filename: 'app.js'
  91. },
  92. plugins: [
  93. ...config.plugins,
  94. ...(!DEBUG && [
  95. new webpack.optimize.DedupePlugin(),
  96. new webpack.optimize.UglifyJsPlugin({compress: {warnings: VERBOSE}}),
  97. new webpack.optimize.AggressiveMergingPlugin()
  98. ]),
  99. ...(WATCH && [
  100. new webpack.HotModuleReplacementPlugin()
  101. ])
  102. ]
  103. });
  104. // Configuration for server-side pre-rendering bundle
  105. const pagesConfig = merge({}, config, {
  106. entry: './src/js/app.js',
  107. output: {
  108. filename: 'app.node.js',
  109. libraryTarget: 'commonjs2'
  110. },
  111. target: 'node',
  112. externals: /^[a-z][a-z\.\-\/0-9]*$/i,
  113. plugins: config.plugins.concat([
  114. new webpack.optimize.LimitChunkCountPlugin({ maxChunks: 1 })
  115. ]),
  116. node: {
  117. console: false,
  118. global: false,
  119. process: false,
  120. Buffer: false,
  121. __filename: false,
  122. __dirname: false
  123. }
  124. });
  125. export default [appConfig, pagesConfig];