/** * React Static Boilerplate * https://github.com/koistya/react-static-boilerplate * * Copyright © 2015-2016 Konstantin Tarkus (@koistya) * * This source code is licensed under the MIT license found in the * LICENSE.txt file in the root directory of this source tree. */ const path = require('path'); const webpack = require('webpack'); const extend = require('extend'); const pkg = require('../package.json'); const isDebug = !(process.argv.includes('--release') || process.argv.includes('-r')); const isVerbose = process.argv.includes('--verbose') || process.argv.includes('-v'); /** * Webpack configuration (core/main.js => build/bundle.js) * http://webpack.github.io/docs/configuration.html */ const config = { // The base directory context: path.resolve(__dirname, '../'), // The entry point for the bundle entry: ['./core/app.js'], // Options affecting the output of the compilation output: { path: path.resolve(__dirname, '../build'), publicPath: '/', file: 'build/[name].js', sourcePrefix: ' ', }, // Switch loaders to debug or release mode debug: isDebug, // Developer tool to enhance debugging, source maps // http://webpack.github.io/docs/configuration.html#devtool devtool: isDebug ? 'source-map' : false, // What information should be printed to the console stats: { colors: true, reasons: isDebug, hash: isVerbose, version: isVerbose, timings: true, chunks: isVerbose, chunkModules: isVerbose, cached: isVerbose, cachedAssets: isVerbose, }, // The list of plugins for Webpack compiler plugins: [ new webpack.optimize.OccurenceOrderPlugin(), new webpack.DefinePlugin({ 'process.env.NODE_ENV': isDebug ? '"development"' : '"production"', __DEV__: isDebug, }), ], // Options affecting the normal modules module: { loaders: [ { test: /\.jsx?$/, include: [ path.resolve(__dirname, '../components'), path.resolve(__dirname, '../core'), path.resolve(__dirname, '../routes'), ], loader: 'babel-loader', query: extend({}, pkg.babel, { babelrc: false }), }, { test: /\.css/, loaders: [ 'style-loader', `css-loader?${JSON.stringify({ sourceMap: isDebug, // CSS Modules https://github.com/css-modules/css-modules modules: true, localIdentName: isDebug ? '[name]_[local]_[hash:base64:3]' : '[hash:base64:4]', // CSS Nano http://cssnano.co/options/ minimize: !isDebug, })}`, 'postcss-loader', ], }, { test: /\.json$/, loader: 'json-loader', }, { test: /\.md$/, loader: path.resolve(__dirname, './webpack.markdown-loader.js'), }, { test: /\.(png|jpg|jpeg|gif|svg|woff|woff2)$/, loader: 'url-loader?limit=10000', }, { test: /\.(eot|ttf|wav|mp3)$/, loader: 'file-loader', }, ], }, // The list of plugins for PostCSS // https://github.com/postcss/postcss postcss(bundler) { return [ // Transfer @import rule by inlining content, e.g. @import 'normalize.css' // https://github.com/postcss/postcss-import require('postcss-import')({ addDependencyTo: bundler }), // W3C custom properties for variables, e.g. :root { --color: red; } div { background: var(--color); } // https://github.com/postcss/postcss-custom-properties require('postcss-custom-properties')(), // W3C calc() function, e.g. div { height: calc(100px - 2em); } // https://github.com/postcss/postcss-calc require('postcss-calc')(), // W3C color() function, e.g. div { background: color(red alpha(90%)); } // https://github.com/postcss/postcss-color-function require('postcss-color-function')(), // Convert CSS shorthand filters to SVG equivalent, e.g. .blur { filter: blur(4px); } // https://github.com/iamvdo/pleeease-filters require('pleeease-filters')(), // Generate pixel fallback for "rem" units, e.g. div { margin: 2.5rem 2px 3em 100%; } // https://github.com/robwierzbowski/node-pixrem require('pixrem')(), // Pseudo elements such as a:before { } // https://github.com/axa-ch/postcss-pseudoelements require('postcss-pseudoelements')(), // Transforms :not() W3C CSS Level 4 pseudo class to :not() CSS Level 3 selectors // https://github.com/postcss/postcss-selector-not require('postcss-selector-not')(), // Add vendor prefixes to CSS rules using values from caniuse.com // https://github.com/postcss/autoprefixer require('autoprefixer')(), ]; }, }; // Optimize the bundle in release (production) mode if (!isDebug) { config.plugins.push(new webpack.optimize.DedupePlugin()); config.plugins.push(new webpack.optimize.UglifyJsPlugin({ compress: { warnings: isVerbose } })); config.plugins.push(new webpack.optimize.AggressiveMergingPlugin()); } module.exports = config;