前言
後臺系統中，表單需求不會少，表格+分頁器+篩選條件。
（今天我們不加班）
（今天我們不開發）
以此爲目標
寫一個命令行，讓他替我們‘自動開發’
基於vue+element-ui進行開發
參考的文章：
[vue-cli3 項目從搭建優化到docker部署](https://juejin.im/post/5c4a6fcd518825469414e062)這篇文章對於學習vue-cli3腳手架有很大的幫助，受教了
操作指南
[toc]
安裝
npm i automation-template -D
npm link automation-template //此命令的作用是使操作命令可以在項目內直接使用
使用
以下命令缺一不可
autopage -h
Usage: autopage [options]
Options:
-V, --version output the version number
-s --save [save] 文件輸出的位置
-n --name [name] 文件名稱
-k --key [key] 文件唯一標識
-h, --help output usage information
/**
* @example autopage --save src/main/views/userAnalysis/loadPageAnalysis --name dddd --key 11121212
**/
自定義功能
包括分頁、篩選條件配置等
最後會輸出結果json，拿去給後端！！！交互
原理
其實很簡單，整個插件分爲兩個大步驟
1、nodejs進行命令行交互，並返回JSON數據格式
2、寫一個標準的模板，獲取參數生成文檔流進行寫入
nodejs部分
主要使用兩個插件進行交互
"dependencies": {
"chalk": "^2.4.2", //命令行有顏色
"commander": "^2.20.0", //命令行option
"inquirer": "^6.3.1" // 命令行交互}
具體不詳細敘述，遇到的坑有
1、異步問題，使用promise async可以有效解決
2、nodejs讀寫流部分
template部分
目前的流程是基於vue+elemet-ui實現的
其實可以替換不同的template，甚至可以配置。
後期會進化一下流程。
主要作用在於輸出一個字符串，根據標準，能夠節省我們引用組件，對於數據操作的繁瑣性。
感謝我的夥伴～～ 這一部分是由她開發的。
嘻嘻嘻
並且最後進行自動路由掛載，其實方法有很多，這裏提供一種
const components = require.context('./views/table', false, /\.vue$/);
寫在後面
源碼
github項目地址
感謝我的夥伴和我一起完成這個小demo。
一些廢話
從事前端的時間並算不長，寫的文章也比較粗淺。
剛剛從事前端的時候，會有一些迷茫，不知道前端的道路到底有多遠。
所謂剛入江湖，天下無敵。
哈哈，在每天顛覆的前端技術棧折磨以後，才真正的開始熱愛前端。
希望自己每天都能進步一點點，在公司裏創造一個好的前端環境。
在未從事前端之前，我曾質疑熱愛某種職業是虛幻的。
加油啊！！！