内容简介:后台系统中,表单需求不会少,表格+分页器+筛选条件。(今天我们不加班)(今天我们不开发)
前言
后台系统中,表单需求不会少,表格+分页器+筛选条件。
(今天我们不加班)
(今天我们不开发)
以此为目标
写一个命令行,让他替我们‘自动开发’
基于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$/);
写在后面
源码
感谢我的伙伴和我一起完成这个小demo。
一些废话
从事前端的时间并算不长,写的文章也比较粗浅。
刚刚从事前端的时候,会有一些迷茫,不知道前端的道路到底有多远。
所谓刚入江湖,天下无敌。
哈哈,在每天颠覆的前端技术栈折磨以后,才真正的开始热爱前端。
希望自己每天都能进步一点点,在公司里创造一个好的前端环境。
在未从事前端之前,我曾质疑热爱某种职业是虚幻的。
加油啊!!!
以上所述就是小编给大家介绍的《【开箱即食】命令行替你写表单》,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对 码农网 的支持!
猜你喜欢:- Elasticsearch 开箱指南
- Elasticsearch 开箱指南
- Java 14 开箱,它真香香香香
- Java 14 开箱,它真香香香香
- 开箱即用的 WebRTC 开发环境
- 把 GitHub 放入口袋,“开箱” 官方客户端
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。
图片转BASE64编码
在线图片转Base64编码工具
SHA 加密
SHA 加密工具