比如我们项目有两个模块的接口，分别是模块一和模块二
这个时候我们可以创建两个js文件来管理这两个模块的接口
比如test1.js和test2.js
这两个js如下 在根目录创建coder > interface > test1和test2文件
module.exports = {
name: '模块一',
model: [
{
path: '/aaa', //接口名称
title: '接口一', //接口中文名称
name: 'aaa',
methods: false,
option: {
method: 'get' // 请求的方法
},
state: 'aaa' // 调用接口时的请求方法
},
{
path: '/bbb',
title: '接口二',
name: 'bbb',
methods: false,
state: 'bbb'
}
]
}
module.exports = {
name: '模块二',
model: [
{
path: '/ccc',
title: '接口三',
name: 'ccc',
methods: false,
option: {
method: 'get'
},
state: 'ccc'
}
]
}
在coder文件夹下创建config.js定义一些配置文件
module.exports = {
// 这里是放所有模块接口的js文件夹路径
interface: './interface/',
// 生成api文件路径'
interfaceApi: '../src/base/api/',
//模板文件目录
templatesDir: './templates/',
// 接口地址
API_URL: 'http://localhost:8081'
}
在coder文件夹下创建index.js作为入口，首先获取接口文件夹下得所有接口文件路径
const fs = require('fs')
const path = require('path')
// 引入遍历插件
const _ = require('lodash')
// const rm = require('rimraf')
// 导入生产types模板
// const typesRender = require('./templates/types')
const config = require('./config');
// 首先获取接口文件夹下得所有接口文件路径
function getInterFaceDir() {
// 获取存放接口的文件夹路径
let interfaceDir = path.join(__dirname, config.interface);
let fileList = [];
// 获取存放接口的文件夹路径下面的文件名称，['test1', 'test2']
let files = fs.readdirSync(interfaceDir);
// 遍历文件名称
_.each(files, function(file) {
// 获取完整的路径
let filePath = path.join(interfaceDir, file);
// 判断是不是js文件
if(file.indexOf('.js') > 0) {
fileList.push({
name: file,
path: filePath
});
}
});
// console.log(fileList);
return fileList
}
根据配置文件生成json
const interfaceFiles = getInterFaceDir();
// 根据配置文件生成json
function getInterFaceInfo(files) {
let models = {}
_.each(files, function(file) {
models[file.name] = require(file.path);
});
// console.log(models, 'models');
return models;
}
const interfaceInfo = getInterFaceInfo(interfaceFiles);
解析json格式，返回可使用并符合自己要求的map格式
// 解析models
function getInterFaceJson(schemas) {
let results = {}
_.each(schemas, function(schema, name) {
// console.log(schema.model, 'results');
results[name] = parseModel(schema.model);
});
// console.log(results, 'results');
return results;
}
function parseModel(model) {
let arr = [];
_.each(model, function(item) {
let options = _.extend({}, {method: 'post'}, item.option || {});
arr.push({
path: item.path,
options: options,
methodType: item.methods,
httpMethod: item.methods,
name: item.name,
state: item.state.toUpperCase(),
title: item.title
});
});
return arr;
}
const interfaceJson = getInterFaceJson(interfaceInfo);
创建一个通用的模板，在coder文件夹下创建templates文件夹，创建types文件
const _ = require('lodash')
module.exports = _.template(`
import axios from 'axios'
<%_.each(model, function(items, name){%>
/**
* <%=items.title%> api
* @module base/api/<%=items.name%>
* @ author chengweituo
*/
export const <%=items.state%> = '<%=url%>' + '<%=items.path%>'
export function <%=items.name%> (data) {
let dataType = '<%=items.options.method%>' === 'get' ? 'params' : 'data';
return axios({
method: '<%=items.options.method%>',
[dataType]: data,
url: <%=items.state%>
});
}
<%})%>
`)
输出文件到指定位置
// 创建文件
function writeFile(path, fileName, content) {
if(!fs.existsSync(path)) {
fs.mkdirSync(path);
}
fs.writeFileSync(path + fileName, content, {encoding: 'utf8'});
}
const tempaltes = require('./templates/types');
function writeApi(json, info) {
_.each(json, function(model, name) {
// 指定输出位置
const interfaceApi = path.join(__dirname, config.interfaceApi);
console.log(model);
writeFile(interfaceApi, name, tempaltes({
model: model,
url: config.API_URL
}));
});
}
初始化项目
function init() {
// 初始化
// console.log(SCHEMA, 'asd');
console.log('开始生成代码.....')
writeApi(interfaceJson, interfaceInfo);
console.log('代码构建完成.....')
}
init()
怎么用，在package.json里面运行
QQ截图20191204174428.png
运行后的效果
QQ截图20191204174630.png
在项目中运用
<script>
import {aaa, bbb } from '../base/api/test1.js'
export default {
name: 'HelloWorld',
data () {
return {
msg: '动态生成api接口'
}
},
mounted () {
aaa({aa: 12, bb:13}).then(res => {
});
bbb({aa: 12, bb:13}).then(res => {
});
}
}
</script>
