config.js 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134
  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: (WATCH ? [
  86. 'webpack/hot/dev-server',
  87. 'webpack-hot-middleware/client'
  88. ] : []).concat([
  89. './src/js/app.js'
  90. ]),
  91. output: {
  92. filename: 'app.js'
  93. },
  94. plugins: [
  95. ...config.plugins,
  96. ...(DEBUG ? [] : [
  97. new webpack.optimize.DedupePlugin(),
  98. new webpack.optimize.UglifyJsPlugin({compress: {warnings: VERBOSE}}),
  99. new webpack.optimize.AggressiveMergingPlugin()
  100. ]),
  101. ...(WATCH ? [
  102. new webpack.HotModuleReplacementPlugin(),
  103. new webpack.NoErrorsPlugin()
  104. ] : [])
  105. ]
  106. });
  107. // Configuration for server-side pre-rendering bundle
  108. const pagesConfig = merge({}, config, {
  109. entry: './src/js/app.js',
  110. output: {
  111. filename: 'app.node.js',
  112. libraryTarget: 'commonjs2'
  113. },
  114. target: 'node',
  115. externals: /^[a-z][a-z\.\-\/0-9]*$/i,
  116. plugins: config.plugins.concat([
  117. new webpack.optimize.LimitChunkCountPlugin({ maxChunks: 1 })
  118. ]),
  119. node: {
  120. console: false,
  121. global: false,
  122. process: false,
  123. Buffer: false,
  124. __filename: false,
  125. __dirname: false
  126. }
  127. });
  128. export default [appConfig, pagesConfig];