前言

使用vue這個(gè)框架已經(jīng)陸陸續(xù)續(xù)做了好幾個(gè)項(xiàng)目了，不知不覺也已經(jīng)在公司呆了4個(gè)月，轉(zhuǎn)正了。時(shí)間如水。。。（省略一萬字）。／咳～不瞎扯了，公司是直接用的官方腳手架生成項(xiàng)目，官方模版沒有vuex，axios這些支持，模版也是最原始的模版，所以每次初始化項(xiàng)目都要做一堆配置，非常麻煩。所以就想著自己定制一套。
非常幸運(yùn)，vue友好的支持我們自己的模版?zhèn)}庫，這樣可以節(jié)省不少抄作業(yè)的過程。開始動(dòng)手學(xué)習(xí)吧。

template

fork一份自己喜歡的模版 ——以webpack為例

vue有一個(gè)官方模版組織 傳送門：vue官方模版

這些官方模版都是可以fork自行改造的。fork到自己倉庫后 ，我們就可以通過

vue init username/repo my-project

來生成自己模版，這里有個(gè)小坑，倉庫不要忘了加分支，比如

vue init xu455255849/vue-xu#devlop my-project

不然你永遠(yuǎn)都是直接init master分支，而無法生成自己模版。po主也是被同事點(diǎn)醒～??

自定義配置插件

文件目錄有個(gè) meta.js文件，其中有個(gè)prompts參數(shù)，可以定義用戶輸入，我們可以在這個(gè)地方添加或者刪除一些配置。

用戶選擇

這樣我們就可以獲取用戶對(duì)是否安裝插件的選擇，根據(jù)用戶的選擇我們可以判斷是否生成該文件。

vuex

根據(jù)用戶選擇渲染文件（啟用插件）

根據(jù)用戶的選擇，我們要判斷是否渲染文件以及安裝一些一些依賴。

依賴

插件啟用

不同的插件，可能方式是不一樣的，所以需要根據(jù)插件引入方式編寫渲染邏輯。

定制自己的模版風(fēng)格

上面講了一些插件的自定義，接下來在談?wù)刾o主的一些模版風(fēng)格給大家參考參考，當(dāng)然，自己喜歡就好。

路由

定義頁面

后記

上面po主提的還都是些比較大眾的，基本的配置，這些配置其實(shí)還可以細(xì)化，比如 提供多個(gè)css預(yù)處理工具選擇，less，sass，stylus，可以隨意切換，根據(jù)項(xiàng)目類型渲染模版，定制不同類型的模版，都可以在開發(fā)中節(jié)約大量時(shí)間。有個(gè)模版～復(fù)制代碼都舒服多了??～～

如果覺得本文對(duì)你有所幫助，就star一下吧～大傳送之術(shù)！ 我的博客Github

po主目前還在開發(fā)一個(gè)npm工具，配套模版使用，大致功能就是通過命令直接生成頁面 ，組件等文件，倉庫已經(jīng)就緒，下篇文章會(huì)寫這個(gè)npm插件相關(guān)開發(fā)過程～

new一個(gè)文件。。。創(chuàng)建 html，，，css，，，js，，又要復(fù)制一些基本的代碼進(jìn)來。。麻煩死了～