現如今的開發，比如是內部使用的管理平台這種專案大都時間比較倉倉促。實際上來說在使用了webpack + vue 這一套來開發的話已經大大了提高了效率。但是對於我們的開發層面。還是有很多地方可以再次提高我們的專案開發效率，讓我們更加專注於業務，畢竟時間就是生命。下面我們挨個來**。
webpack是實現我們前端專案工程化的基礎，但其實她的用處遠不僅僅如此，我們可以通過webpack來幫我們做一些自動化的事情。首先我們要了解require.context()這個api
您可以使用其實是require.context（）函式建立自己的上下文。 它允許您傳入乙個目錄進行搜尋，乙個標誌指示是否應該搜尋子目錄，還有乙個正規表示式來匹配檔案。
webpack通過解析require()的呼叫，提取出來如下這些資訊：
directory: ./template
regular expression: /^.*\.ejs$/
我們可以通過這個方法篩選出來我們需要的檔案並且讀取
下面我們來簡單看一看使用:
/**
* @param directory 要搜尋的資料夾目錄不能是變數，否則在編譯階段無法定位目錄
* @param usesubdirectories 是否搜尋子目錄
* @param regexp 匹配檔案的正規表示式
* @return function 返回乙個具有 resolve, keys, id 三個屬性的方法
resolve() 它返回請求被解析後得到的模組 id
keys() 它返回乙個陣列，由所有符合上下文模組處理的請求組成。
id 是上下文模組裡面所包含的模組 id. 它可能在你使用 module.hot.accept 的時候被用到
*/require.context('demo', usesubdirectories = false, regexp = /\.js$/)
// (建立了）乙個包含了 demo 資料夾（不包含子目錄）下面的、所有檔名以 `js` 結尾的、能被 require 請求到的檔案的上下文。
對於vue中的路由，大家都很熟悉，類似於宣告式的配置檔案，其實已經很簡潔了。現在我們來讓他更簡潔
分割路由
首先為了方便我們管理，我們把router目錄下的檔案分割為以下結構
router // 路由資料夾
|__index.js // 路由組織器：用來初始化路由等等
|__common.js // 通用路由：宣告通用路由
|__modules // 業務邏輯模組：所以的業務邏輯模組
|__index.js // 自動化處理檔案：自動引入路由的核心檔案
|__home.js // 業務模組home：業務模組
|__a.js // 業務模組a
vue專案加快速度
1壓縮 2加快伺服器頻寬 3即在config index.js中將productionsourcemap的值修改為false，就可以在編譯時不生成.map檔案了 productionsourcemap false,4vue.js編譯時給生成的檔案增加版本號 5vue router路由懶載入 解決vu...
並行編譯加快VS C 專案的編譯速度
最近編譯的專案都比較大，話說自己的電腦配置還行，但編譯所花的時間還是很長，遇到需要重新編譯整個專案的時候真的有回宿舍睡一覺的衝動。昨天一不小心被我發現了一款軟體xoreax incredibuild 今天用了一下，實在是太爽了，我把我們辦公室的機器都連了起來，其中還有一台工作站，總共加起來22個cu...
提高 webpack 構建 Vue 專案的速度
最近有人給我的 vue2 後台管理系統解決方案 提了 issue 說執行 npm run build 構建專案的時候極其慢，然後就引起我的注意了。在專案中，引入了比較多的第三方庫，導致專案大，而每次修改，都不會去修改到這些庫，構建卻都要再打包這些庫，浪費了不少時間。所以，把這些不常變動的第三方庫都提...