vue-cli脚手架中webpack配置--builder.js说明

版权声明：本文为博主原创文章，未经博主允许不得转载。如有转载请留言，谢谢~ https://blog.csdn.net/qq_38209578/article/details/89844686

本文主要介绍构建基础版本的builder.js

'use strict'//严格模式
require('./check-versions')()//check-versions：用于检测node和npm的版本，实现版本依赖。加（）代表直接调用该函数 

process.env.NODE_ENV = 'production'//设置当前是生产环境

//下面定义常量引入插件
const ora = require('ora')//加载动画
const rm = require('rimraf')//删除文件
const path = require('path')
const chalk = require('chalk')//对文案输出的一个彩色设置
const webpack = require('webpack')
const config = require('../config')//默认读取下面的index.js文件
const webpackConfig = require('./webpack.prod.conf')

//调用start的方法实现加载动画，优化用户体验
const spinner = ora('building for production...')
spinner.start()

//先删除dist文件再生成新文件，因为有时候会使用hash来命名，删除整个文件可避免冗余
rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err => {
  if (err) throw err
  webpack(webpackConfig, (err, stats) => {
    spinner.stop()
    if (err) throw err
    process.stdout.write(stats.toString({
      colors: true,
      modules: false,
      children: false, // If you are using ts-loader, setting this to true will make TypeScript errors show up during build.
      chunks: false,
      chunkModules: false
    }) + '\n\n')

    if (stats.hasErrors()) {
      process.exit(1)
    }

    console.log(chalk.cyan('  Build complete.\n'))
    console.log(chalk.yellow(
      '  Tip: built files are meant to be served over an HTTP server.\n' +
      '  Opening index.html over file:// won\'t work.\n'
    ))
  })
})

严格模式

ECMAScript 5 引入严格模式(‘strict mode’)概念。通过严格模式，在函数内部选择进行较为严格的全局或局部的错误条件检测，使用严格模式的好处是可以提早知道代码中的存在的错误，及时捕获一些可能导致编程错误的ECMAScript行为。在开发中使用严格模式能帮助我们早发现错误。