Skip to content

Instantly share code, notes, and snippets.

@MrRoyce

MrRoyce/gist:280063164a5f744cb0ec3ecc36be84a7

Last active April 28, 2017 20:26
Download ZIP

Revisions

  1. MrRoyce revised this gist Sep 27, 2016. 1 changed file with 3 additions and 3 deletions.
    6 changes: 3 additions & 3 deletions gistfile1.txt
    View file
    Original file line number Diff line number Diff line change
    @@ -1,11 +1,11 @@
    /**
    * @Author: Royce
    * @Date: 2016-06-12T10:54:44-04:00
    * @Email: rharding@gotonight.com
    * @Project: Go Tonight
    * @Email: rharding@tonight.com
    * @Project: Tonight
    * @Last modified by: royce
    * @Last modified time: 2016-09-23T19:58:59-04:00
    * @License: © 2016 GoTonight LLC All Rights Reserved
    * @License: © 2016 Tonight LLC All Rights Reserved
    */

    /*eslint-disable global-require*/
  2. MrRoyce created this gist Sep 26, 2016.
    273 changes: 273 additions & 0 deletions gistfile1.txt
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,273 @@
    /**
    * @Author: Royce
    * @Date: 2016-06-12T10:54:44-04:00
    * @Email: rharding@gotonight.com
    * @Project: Go Tonight
    * @Last modified by: royce
    * @Last modified time: 2016-09-23T19:58:59-04:00
    * @License: © 2016 GoTonight LLC All Rights Reserved
    */

    /*eslint-disable global-require*/
    const
    path = require('path')
    ;

    const resolve = path.resolve;

    const root = resolve(__dirname);

    //const modules = path.join(root, 'node_modules');

    const
    HtmlWebpackPlugin = require('html-webpack-plugin'), //used to create default index.html
    merge = require('webpack-merge'),
    webpack = require('webpack'),
    NpmInstallPlugin = require('npm-install-webpack-plugin'),
    CleanWebpackPlugin = require('clean-webpack-plugin'),
    ExtractTextPlugin = require('extract-text-webpack-plugin'),
    CopyWebpackPlugin = require('copy-webpack-plugin')
    ;

    const NODE_ENV = process.env.NODE_ENV;
    const dotenv = require('dotenv');

    // Load *package.json* so we can use `dependencies` from there
    const pkg = require('./package.json');
    const
    PATHS = {
    //react: path.join(__dirname, 'node_modules/react/dist/react.min.js'),
    app : path.join(__dirname, 'src'),
    fonts : path.join(__dirname, 'fonts'), //copied direcly with copy-webpack-plugin
    styles : path.join(__dirname, 'src', 'styles'),
    modules : path.join(__dirname, 'node_modules'),
    test : path.join(__dirname, 'test'),
    assets : path.join(__dirname, 'src', 'assets'),
    images : path.join(__dirname, 'src', 'assets', 'images'),
    build : path.join(__dirname, 'build')
    },
    TARGET = process.env.npm_lifecycle_event
    ;

    const common = {
    entry : [
    require.resolve('./polyfills'),
    PATHS.app
    ],
    // entry : {
    // app : PATHS.app
    // },
    output : {
    path : PATHS.build,
    publicPath : '/',
    filename : '[name].js' // Output using the entry name instead of bundle.js
    },
    resolveLoader: {
    root : path.resolve('node_modules'),
    moduleTemplates : ['*-loader']
    },
    module : {
    loaders : [
    {
    test : /\.json$/,
    loader : 'json-loader'
    },
    {
    test : /\.js?$/,
    exclude : /node_modules/,
    loader : 'babel',
    query : (TARGET === 'build' || TARGET === 'stats') ? require('./babel.prod') : require('./babel.dev')
    }
    ]
    },
    resolve : {
    root : [path.join(__dirname)],
    extensions : ['', '.js', '.jsx'],
    alias : {
    'actions' : path.join(PATHS.app, 'actions'),
    'assets' : path.join(PATHS.app, 'assets'),
    'components' : path.join(PATHS.app, 'components'),
    'containers' : path.join(PATHS.app, 'containers'),
    'config' : path.join(root),
    'css' : path.join(PATHS.app, 'styles'), // duplicate from styles
    'logic' : path.join(PATHS.app, 'logic'),
    'reducers' : path.join(PATHS.app, 'reducers'),
    'src' : PATHS.app,
    'styles' : path.join(PATHS.app, 'styles'),
    'utils' : path.join(PATHS.app, 'utils'),
    // This `alias` section can be safely removed after ejection.
    // We do this because `babel-runtime` may be inside `react-scripts`,
    // so when `babel-plugin-transform-runtime` imports it, it will not be
    // available to the app directly. This is a temporary solution that lets
    // us ship support for generators. However it is far from ideal, and
    // if we don't have a good solution, we should just make `babel-runtime`
    // a dependency in generated projects.
    // See https://github.com/facebookincubator/create-react-app/issues/255
    'babel-runtime/regenerator': require.resolve('babel-runtime/regenerator')
    }
    },
    devServer : {
    historyApiFallback : true,
    contentBase : './'
    },
    plugins: [
    new webpack.optimize.DedupePlugin() // remove duplicate dependencies
    ]
    };

    // ENV variables
    const dotEnvVars = dotenv.config();
    const environmentEnv = dotenv.config({
    path: path.join(root, 'config', `${NODE_ENV}.config.js`),
    silent: true
    });
    const envVariables =
    Object.assign({}, dotEnvVars, environmentEnv);

    const defines =
    Object.keys(envVariables)
    .reduce((memo, key) => {
    const val = JSON.stringify(envVariables[key]);
    memo[`__${key.toUpperCase()}__`] = val;
    return memo;
    }, {
    __NODE_ENV__: JSON.stringify(NODE_ENV)
    });

    common.plugins = [
    new webpack.DefinePlugin(defines)
    ].concat(common.plugins);
    // END ENV variables
    //

    // Default configuration. Return this if
    // webpack is called outside of npm.
    if (TARGET === 'start' || !TARGET || TARGET === 'test') {
    module.exports = merge(common, {
    output : {
    path : __dirname,
    publicPath : '/',
    filename : 'bundle.js',
    pathinfo : true
    },
    externals : {
    'react/lib/ReactContext': true,
    'react/lib/ExecutionEnvironment': true,
    'react/addons': true
    },
    devtool : 'eval-source-map',
    devServer : {
    // Enable history API fallback so HTML5 History API based
    // routing wrks. This is a good default that will come in
    // handy in more complicated setups
    historyApiFallback : true,
    progress : true,
    stats : 'errors-only', // Display only error to reduce the amount of output
    host : process.env.HOST, // Parse host and port from env to allow customization
    port : process.env.PORT,
    contentBase : './'
    },
    plugins : [
    new webpack.HotModuleReplacementPlugin(),
    new NpmInstallPlugin({
    save : true
    })
    ],
    module : {
    loaders : [
    {
    // Test expects a regExp, note the slashes
    test : /\.css$/,
    loaders : ['style', 'css']
    }
    ]
    }
    });
    }

    // Production build
    if (TARGET === 'build' || TARGET === 'stats') {
    module.exports = merge(common, {
    bail: true,
    // Define vendor entry point needed for splitting
    entry : {
    // Set up an entry chunk for our vendor bundle.
    // You can filter out dependencies here if needed with
    // `.filter(...)`.
    vendor : Object.keys(pkg.dependencies)
    },
    // eeded this node param to fix weird bug
    // about finding fs when running build
    node: {
    fs: 'empty'
    },
    output : {
    path : PATHS.build,
    filename : '[name].[chunkhash].js',
    chunkFilename : '[chunkhash].js'
    },
    module : {
    loaders : [
    // Extract CSS during build
    {
    test : /\.css$/,
    loader : ExtractTextPlugin.extract('style', 'css')
    }
    ]
    },
    plugins: [
    new webpack.optimize.OccurrenceOrderPlugin(true),
    // Output extracted CSS to a file
    new ExtractTextPlugin('[name].[chunkhash].css'),
    new CleanWebpackPlugin([PATHS.build]), // clean build dir
    // Extract vendor and manifest files
    new webpack.optimize.CommonsChunkPlugin({
    names : ['vendor', 'manifest'],
    children: true
    }),
    // Setting DefinePlugin affects React library size!
    // DefinePlugin replaces content "as is" so we need some
    // extra quotes for the generated code to make sense
    new webpack.DefinePlugin({
    'process.env.NODE_ENV': '"production"'
    }),
    new webpack.optimize.UglifyJsPlugin({
    compress: {
    screw_ie8: true,
    warnings: false
    },
    mangle: {
    screw_ie8: true
    },
    output: {
    comments: false,
    screw_ie8: true
    }
    }),
    new HtmlWebpackPlugin({ // Used to create default index.html
    title : 'Go Tonight',
    template : path.join(PATHS.assets, 'index.ejs'),
    mobile : true,
    inject : false,
    favicon : path.join(__dirname, 'src', 'assets', 'images', 'favicon.ico'),
    minify: {
    removeComments: true,
    collapseWhitespace: true,
    removeRedundantAttributes: true,
    useShortDoctype: true,
    removeEmptyAttributes: true,
    removeStyleLinkTypeAttributes: true,
    keepClosingSlash: true,
    minifyJS: true,
    minifyCSS: true,
    minifyURLs: true
    }
    }),
    new CopyWebpackPlugin([ // copy robots, favicon, etc
    { from: path.join(PATHS.assets, 'robots.txt') },
    { from: path.join(PATHS.styles, 'icon-style.css'), to: 'styles'},
    { from: PATHS.fonts, to : 'fonts' } // create font directory on build
    ])
    ]
    });
    }