筆者目的是在vue專案打包後的 dist/index.html 檔案中寫入本次打包git使用者、最後一次git提交資訊，這樣做的目的是便於線上專案的管理和防止同事之間的相互扯皮。
最後打包出的效果如下圖：
版本資訊需要記錄 git最後一次提交作者（作者名和郵箱郵）、日期、commit head，本次打包git使用者和郵箱、日期，這些資訊都需要使用 git 命令來獲取到。在 node 中，要執行一段命令列腳步需要使用 child_process 模組。
專案 build 目錄下新建 version.js 檔案，編寫如下**：
const child_process = require('child_process')
// git 最後一次提交的 head
const commit = child_process.execsync('git show -s --format=%h').tostring().trim()
const commitusername = child_process.execsync('git show -s --format=%cn').tostring().trim()
const commitusermail = child_process.execsync('git show -s --format=%ce').tostring().trim()
const commitdateobj = new date(child_process.execsync(`git show -s --format=%cd`).tostring())
const commitdate = `$`
const buildusername = child_process.execsync('git config user.name').tostring().trim()
const buildusermail = child_process.execsync('git config user.email').tostring().trim()
const nowdate = new date()
const builddate = `$`
module.exports =
在 webpack.prod.conf.js 檔案中引入 version.js 模組，並修改 htmlwebpackplugin 外掛程式的配置。
const buildinfo = require('./version.js')
new htmlwebpackplugin(,
// necessary to consistently work with multiple chunks via commonschunkplugin
chunkssortmode: 'dependency',
buildinfo: json.stringify(buildinfo)
}),
接著在 index.html 檔案內容開頭新增 版本資訊注釋。
commit:2、 webpack.prod.conf.js 檔案中新增乙個 htmlwebpackplugin 配置項commitusername:
commitdate:
buildusername:
buildusermail:
builddate:
new htmlwebpackplugin(,這樣打包後會生成 dist\static\version.html ，成功將 版本資訊和index.html 檔案分離。buildinfo: buildinfo
}),
本文**自：
webpack打包快取 webpack打包效能分析
webpack提供的uglifyjs外掛程式由於採用單執行緒壓縮，速度很慢 webpack parallel uglify plugin外掛程式可以並行執行uglifyjs外掛程式，這可以有效減少構建時間，當然，該外掛程式應用於生產環境而非開發環境，配置如下 var paralleluglifypl...
webpack打包快取 webpack打包優化探索
雖然webpack的已經公升級到了webpack4，而我們目前還在使用 webpack3，但其中的優化點都大同小異，公升級後同樣適用。效能優化初步原則 這三條原則永遠是一切優化的前提 優化配置 公升級webpack 3，優化js的編譯能力 scope hoisting 1performance 減小...
webpack腳手架增加版本號
1.product模式下，新增版本號 1 common.js檔案中，輸出的檔案路徑要跟著變化 output 2 外掛程式中的html也要修改html的路徑 newhtmlwebpackplugin 3 production檔案 const config require package.json le...