vue-cli中的build.js配置文件詳細解析

轉載自：https://www.cnblogs.com/ye-hcj/p/7096341.html
這是vue-cli腳手架工具的生產環境配置入口 package.json中的"build": "node build/build.js"的直接指向。

//版本檢查 node的版本號  版本有要求"engines": {"node": ">= 4.0.0","npm": ">= 3.0.0"}
//當即執行

require('./check-versions')()
//process是node中的global全局對象的屬性，process是node中的全局變量，env設置環境變量
process.env.NODE_ENV = 'production'
// ora是一個命令行轉圈圈動畫插件，好看用的
var ora = require('ora')
// rimraf插件是用來執行UNIX命令rm和-rf的用來刪除文件夾和文件，清空舊的文件 var rm = require('rimraf')
// node.js路徑模塊 鏈接路徑，例子：path.join('/foo', 'bar', 'baz/asdf', 'quux', '..');// 返回: '/foo/bar/baz/asdf'var path = require('p//chalk插件，用來在命令行中輸入不一樣顏色的文字

var chalk = require('chalk')
// 引入webpack模塊使用內置插件和webpack方法 var webpack = require('webpack')
//commonJs風格，引入文件模塊，引入模塊分爲內置模塊與文件模塊兩種 var config = require('../config') var webpackConfig = require('./webpack.prod.conf') // 開啓轉圈圈動畫 var spinner = ora('building for production...') spinner.start() // 調用rm方法，第一個參數的結果就是 絕對/工程名/dist/static，表示刪除這個路徑下面的全部文件 rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err => {
// 若是刪除的過程當中出現錯誤，就拋出這個錯誤，同時程序終止 if (err) throw err
// 沒有錯誤，就執行webpack編譯 webpack(webpackConfig, function (err, stats) {
// 這個回調函數是webpack編譯過程當中執行 spinner.stop()// 中止轉圈圈動畫 if (err) throw err　　// 若是有錯誤就拋出錯誤
// 沒有錯誤就執行下面的代碼，process.stdout.write和console.log相似，輸出對象
////process.stdout用來控制標準輸出，也就是在命令行窗口向用戶顯示內容。它的write方法等同於console.log process.stdout.write(stats.toString({
// stats對象中保存着編譯過程當中的各類消息 colors: true,// 增長控制檯顏色開關 modules: false,// 不增長內置模塊信息 children: false,// 不增長子級信息 chunks: false,// 容許較少的輸出 chunkModules: false // 不將內置模塊的信息加到包信息 }) + '\n\n') // 以上就是在編譯過程當中，持續打印消息 
// 下面是編譯成功的消息 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' )) }) })