rightfe/src/utils/webpack-config.js

the front-end-engineer tool

var config = require(process.cwd() + '/rightfe');
var ExtractTextPlugin = require('extract-text-webpack-plugin');

if (!config.js) return

var path = require('path')
var pathToUrl = require('./pathToUrl')
var pathMap = config.alias
var entries = config.entries
var webpack = require('webpack')
var webpackManifest = require('./webpackManifest')

module.exports = function(env) {
  var jsSrc = path.resolve(config.root.src, config.js.src)
  var jsDest = path.resolve(config.root.dest, config.js.dest)
  var publicPath = pathToUrl(config.js.dest, '/')

  var extensions = config.js.extensions.map(function(extension) {
    return '.' + extension
  })

  var rev = config.production.rev && env === 'production'
  var filenamePattern = rev ? '[name]@[hash].js' : '[name].js'

  var webpackConfig = {
    //上下文
    context: jsSrc,
    plugins: [],
    resolve: {
      root: config.root.src,
      alias: pathMap,
      extensions: [''].concat(extensions)
    },
    module: {
      loaders: [{
        test: /\.js$/,
        loader: 'babel-loader',
        exclude: /node_modules/,
        query: config.js.babel
      }, {
        test: /\.vue$/,
        loader: 'vue-loader'
      }, {
        test: /\.html$/,
        loader: 'html'
      }, {
        test: /\.(tpl|ejs)$/,
        loader: 'ejs'
      }, {
        test: /\.(css|scss)$/,
        loader: (config.js.extractCss ? ExtractTextPlugin.extract(
          'style', 'css!sass') : 'style!css!sass')
      }]
    }
  }


  if (env === 'development') {
    webpackConfig.devtool = 'inline-source-map'

    // Create new entries object with webpack-hot-middleware added
    for (var key in entries) {
      var entry = entries[key]
      entries[key] = [
        'webpack-hot-middleware/client?&reload=true'
      ].concat(entry)
    }

    webpackConfig.plugins.push(new webpack.HotModuleReplacementPlugin())
  }

  if (env === 'beta') {
    //webpackConfig.devtool = 'inline-source-map'

    // Create new entries object with webpack-hot-middleware added
    // for (var key in entries) {
    //   var entry = entries[key]
    //   entries[key] = [
    //     'webpack-hot-middleware/client?&reload=true'
    //   ].concat(entry)
    // }
    //
    // webpackConfig.plugins.push(new webpack.HotModuleReplacementPlugin())
  }

  //是否将CSS由style内嵌变成独立.css文件
  if (config.js.extractCss) {
    webpackConfig.plugins.push(new ExtractTextPlugin(
      'public/[name]@[hash].css'))
  }

  if (env !== 'test') {
    webpackConfig.entry = entries

    webpackConfig.output = {
      path: path.normalize(jsDest),
      filename: filenamePattern,
      publicPath: publicPath
    }

    if (config.js.extractSharedJs) {
      webpackConfig.plugins.push(
        new webpack.optimize.CommonsChunkPlugin({
          name: 'shared',
          filename: filenamePattern,
        })
      )
    }
  }

  if (env === 'production') {
    if (rev) {
      webpackConfig.plugins.push(new webpackManifest(publicPath, config.root.dest))
    }
    webpackConfig.plugins.push(
      new webpack.DefinePlugin({
        'process.env': {
          'NODE_ENV': JSON.stringify('production')
        }
      }),
      new webpack.optimize.DedupePlugin(),
      new webpack.optimize.UglifyJsPlugin(),
      new webpack.NoErrorsPlugin()
    )
  }

  return webpackConfig
}