vue-cli中配置webpack系列文章一 ------build.js

build.js

// 设置process.env.NODE_ENV
  process.env.NODE_ENV = 'production'
  //引入ora,可以实现loading效果
  var ora = require('ora');
  //引入webpack模块
  var webpack = require('webpack');
  //引入path模块
  var path = require('path');
  // 引入rimraf模块
  // "rm -rf"命令
  var rm = require('rimraf')
  //引入pro环境
  var webpackConfig = require('./webpack.prod.conf');
  //引入公共配置
  var config = require('../config/index');
  
  //加载时显示的文本
  var spinner = ora('building for production...');
  
  //加载动画开始
  spinner.start()
  
  var assetsPath = path.join(config.build.assetsRoot,config.build.assetsSubDirectory);
  // 清空静态资源的二级目录下所有内容
  rm(assetsPath,err=>{
      if (err) throw err
  
      //启动webpack编译生产环境webpack配置
      webpack(webpackConfig,function (eror,stats) {
          //加载动画结束
          spinner.stop();
          //// 如果出错，抛出错误
          if(eror) throw eror
  
          // process.stdout标准输出流
          // rocess.stdout.write命令行窗口向用户显示内容
          // stats.toString(options)返回格式化结果
          process.stdout.write(stats.toString({
                  colors: true,
                  modules: false,
                  children: false,
                  chunks: false,
                  chunkModules: false
              })+'\n')
      })
  
  })