lanzhsh / react-vue-koa

Vue，React，微信小程序，快应用，TS , Koa, JS一把梭

内容

Vue，React，微信小程序，快应用，TS , Koa和JS 一把梭。

star

^_^欢迎star,你的star是我更新的动力^_^

目录

mini-program-demo：小程序 demo
mini-program-template：小程序 template
react-koa：react+koa 的全栈demo
react-mobile：react 的移动端 demo
dva-umi-template：dva和umi 的 pc端 template
js:原生 js 分析源码
react-pc-template：react 的 pc端 template
react-pc-skill：react 的 pc端技巧整理
vue-demo：vue 的 pc 端 demo
vue-mobile：vue 的移动端端 demo
vue-mobile-template：vue 的移动端端 template
vue-multi-template: vue 的 pc 端多页面 template
vue-pc-template：vue 的pc端 template
vue-ts-template：vue+ts 的pc端 template
code.segment.config：基于 vue-mobile 的 eslint 配置的用户代码片段
ide.config.md：vscode 的插件和一些配置
utils-lan: 工具类

其他

Eslint 配置规则在 vue-mobile 工程
工具类在 vue-mobile 下的 utils

react-vue-koa's Issues

很久没更新了，是放弃了吗？

这个文件引用错了，很全的一个工具，麻烦更新一下，非常感谢

支持接口模拟

接口模拟几乎已经成为每个前端的必备技能。可否集成一下？推荐 mockm ：

npm i mockm -D
npx mockm --template 

功能: 点击查看

• 支持 0 侵入, 无需修改项目中的任何代码即可投入使用
• 快速生成接口和数据, 以及文档
• 支持 Restful API
• 以最方便的形式支持 api 拦截, 注入, 请求及响应修改
• 修改实时生效
• 支持自动允许跨域
• 自动带参调试, 无需登录
• 自动根据接口查找文档和调试地址, 标识字段描述
• 请求记录, 重放
• 当提供接口的后端服务出现问题, 也可最大程度还原接口响应
• 参数预校验, 助你分析接口联调的问题所在
• 无需数据库支持
• 根据接口生成业务代码
• 跨平台, 支持 linux macos windows
• 支持远程调试, 一个属性完成内网穿透

示例: 点击查看

/**
 * @see: https://www.hongqiye.com/doc/mockm/config/option.html
 * @type {import('mockm/@types/config').Config}
 */
module.exports = util => {
  return  {
    // 代理后端的接口, 如果没有可以不填
    proxy: {
      // 根结点
      '/': `https://httpbin.org/`,
      
      // 接口转发
      '/get': `https://www.httpbin.org/ip`,
      
      // 修改响应体中的 json
      '/anything/mid': [`headers.Host`, `xxxxxx`],

      // 使用函数修改响应体
      '/anything/proxy/fn':[({req, json}) => {
        return (json.method + req.method).toLowerCase() // getget
      }],
    },

    // 自己编写的接口
    api: {
      // 当为基本数据类型时, 直接返回数据, 这个接口返回 {"msg":"ok"}
      '/api/1': {msg: `ok`},

      // 也可以像 express 一样返回数据
      '/api/2' (req, res) {
        res.send({msg: `ok`})
      },

      // 一个只能使用 post 方法访问的接口
      'post /api/3': {msg: `ok`},

      // 一个 websocket 接口, 会发送收到的消息
      'ws /api/4' (ws, req) {
        ws.on(`message`, (msg) => ws.send(msg))
      },

      // 一个下载文件的接口
      '/file' (req, res) {
        res.download(__filename)
      },

      // 获取动态的接口路径的参数 code
      '/status/:code' (req, res) {
        res.json({statusCode: req.params.code})
      },
    },
    
    // 自动生成 Restful API
    db: {
      'users': util.libObj.mockjs.mock({
        'data|15-23': [ // 随机生成 15 至 23 条数据
          {
            'id|+1': 1, // id 从 1 开始自增
            name: `@cname`, // 随机生成中文名字
            'sex|1': [`男`, `女`, `保密`], // 性别从这三个选项中随机选择一个
          },
        ]
      }).data,
    },
  }
}