vue-cli腳手架build目錄中的build.js配置文件，主要用于生產(chǎn)環(huán)境
// 此文件是在node環(huán)境中運(yùn)行的颜阐，使用webpack的nodejsAPI實(shí)現(xiàn)自定義構(gòu)建和開發(fā)流程的
// ---------------------
// npm和node版本檢查平窘，請(qǐng)看我的check-versions配置文件解釋文章
require('./check-versions')()
// 設(shè)置環(huán)境變量為production
process.env.NODE_ENV = 'production'
// ora是一個(gè)命令行轉(zhuǎn)圈圈動(dòng)畫插件，好看用的
var ora = require('ora')
// rimraf插件是用來(lái)執(zhí)行UNIX命令rm和-rf的用來(lái)刪除文件夾和文件凳怨，清空舊的文件
var rm = require('rimraf')
// node.js路徑模塊
var path = require('path')
// chalk插件，用來(lái)在命令行中輸入不同顏色的文字
var chalk = require('chalk')
// 引入webpack模塊使用內(nèi)置插件和webpack方法
var webpack = require('webpack')
// 引入config下的index.js配置文件是鬼，此配置文件我之前介紹了請(qǐng)自行查閱肤舞，主要配置的是一些通用的選項(xiàng)
var config = require('../config')
// 下面是生產(chǎn)模式的webpack配置文件，請(qǐng)看我的webpack.prod.conf解釋文章
var webpackConfig = require('./webpack.prod.conf')
// 開啟轉(zhuǎn)圈圈動(dòng)畫
var spinner = ora('building for production...')
spinner.start()
// 調(diào)用rm方法均蜜，第一個(gè)參數(shù)的結(jié)果就是 dist/static李剖，表示刪除這個(gè)路徑下面的所有文件
rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err => {
// 如果刪除的過(guò)程中出現(xiàn)錯(cuò)誤，就拋出這個(gè)錯(cuò)誤囤耳，同時(shí)程序終止
if (err) throw err
// 沒(méi)有錯(cuò)誤篙顺，就執(zhí)行webpack編譯
webpack(webpackConfig, function (err, stats) {
// 這個(gè)回調(diào)函數(shù)是webpack編譯過(guò)程中執(zhí)行
spinner.stop() // 停止轉(zhuǎn)圈圈動(dòng)畫
if (err) throw err // 如果有錯(cuò)誤就拋出錯(cuò)誤
// 沒(méi)有錯(cuò)誤就執(zhí)行下面的代碼，process.stdout.write和console.log類似充择，輸出對(duì)象
process.stdout.write(stats.toString({
// stats對(duì)象中保存著編譯過(guò)程中的各種消息
colors: true, // 增加控制臺(tái)顏色開關(guān)
modules: false, // 不增加內(nèi)置模塊信息
children: false, // 不增加子級(jí)信息
chunks: false, // 允許較少的輸出
chunkModules: false // 不將內(nèi)置模塊的信息加到包信息
}) + '\n\n')
// 以上就是在編譯過(guò)程中德玫，持續(xù)打印消息
// 下面是編譯成功的消息
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'
))
})
})
// end
// 注: 如果你想自己編寫一個(gè)高質(zhì)量的腳手架工具，建議你:
// 去補(bǔ)習(xí)nodejs椎麦，然后補(bǔ)習(xí) es6宰僧，然后再來(lái)看webpack官方文檔，然后自己獨(dú)立編寫一個(gè)和vue-cli類似的腳手架观挎，如果上面的東西看不懂琴儿，更要這樣做
// vue-cli還有一部分內(nèi)容是關(guān)于代碼測(cè)試的段化，可以說(shuō)這塊內(nèi)容的復(fù)雜度不亞于webpack，這些內(nèi)容對(duì)nodejs要求比較熟悉造成，說(shuō)白了就是基礎(chǔ)弱的很難入門显熏，但是測(cè)試這塊內(nèi)容也是非常有價(jià)值的，可以借助無(wú)界面的瀏覽器解析引擎晒屎，通過(guò)一句命令就可以把你的代碼在不同的平臺(tái)上運(yùn)行佃延，還能指出問(wèn)題所在，所以夷磕，我會(huì)漸漸的轉(zhuǎn)戰(zhàn)nodejs去了履肃，后續(xù)的文章將很多是關(guān)于nodejs的文章，如果感興趣的可以關(guān)注我的文章坐桩，一起學(xué)習(xí)探討
文章原址 [葉家偉的博客](https://www.cnblogs.com/ye-hcj/) https://www.cnblogs.com/ye-hcj/p/7096341.html
