1.0.4 • Published 2 years ago

nei-scene-mock v1.0.4

Weekly downloads
-
License
ISC
Repository
-
Last release
2 years ago

使用

安装

npm i nei-scene-mock --save-dev

配置参数

需要在根目录的配置文件 nsm.config.js 增加以下配置

名称含义默认值
neiKeynei 项目 key
neiPid:nei 项目 id
typeConfig类型存储文件./type.config.js
pathConfig路径存储文件./nei.path.js
commonBack接口失败返回{ result: 'success', code: '200'message: 'common back' }
mockDir生成的 mock 数据目录./mock
port服务端口号8686

其他配合

  • webpack 中需要增加 deServer 的路径跳转,比如
   // 获取端口
   const mockConfig = require('./ncm.config.js')
   // 本地配置:
   devServer: {
    clientLogLevel: 'none',
    quiet: true,
    proxy: {
      '/': {
        target: `http://localhost:${mockConfig.port}`,
        secure: false,
        changeOrigin: true,
        // eslint-disable-next-line consistent-return
        bypass: (req) => {
          if (req.url && req.url.indexOf('favicon.ico') > -1) {
            return '/favicon.ico'
          }
          const { accept } = req.headers
          if (accept && accept.indexOf('html') !== -1) {
            return '/index.html'
          }
        }
      }
    },
    // 传递给页面
    chainWebpack: (config) => {
    config.plugin('define').tap((args) => {
      args[0]['process.env'].MOCK_PORT = mockConfig.port
      return args
    })
  }
  • 页面配置。从 webpack 中拿到 port 端口之后,可以按照自己的喜好在页面上增加 mock 入口了

mock 需要实现的功能

  • 可以实现场景化功能,并且自定义场景 done
  • 和 nei 联动,尽早知晓接口变动 done
  • 避免手写 mock 数据,生成的 mock 一定要简单易读 done
  • 可以连上任何场景的数据,包括线上,cookie 问题处理 todo

目前实现:

nei 数据获取,由于 nei 提供的查询接口详情数据,只有第一层数据,所以采用以下曲折方案

  • 根据 nei 接口抓取项目所有的接口,并且写入文件,数据包含接口的更新信息默认为 nei.path.js
  • 根据接口名称获取所有 mock 数据,并且写入文件,文件目录按照接口名称生成,此处的 mock 数据,如果是枚举,默认值需要写成@+枚举名称
  • 获取 nei 所有枚举类型,并且写入文件,默认为 type.config.js

mock 数据设置

  • 页面数据设置,请求之后存入内存,包含页面的枚举选择以及模板
  • 接口请求的时候,先获取文件内容,然后通过内存枚举转换,再实际输出到页面
  • 只要 mock 服务不重启,那么数据状态全局保留,做到真正的类似后端