npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

mocker-api-json

v1.0.9

Published

his is dev support mock RESTful API.

Downloads

16

Readme

mocker-api-json

mocker-api-json that creates mocks for REST APIs. It will be helpful when you try to test your application without the actual REST API server.

特此声明

npm包依赖于mocker-api

喜大普奔,我的npm包上线啦~!!!

991271764c504b5ba6e36ca1f37a58fd.jpeg

有什么用

56846851486484.png

这样的场景,相信大家会觉得似曾相识。此时就需要Mock来帮我做数据模拟

本npm包主要做自定义json,然后Mock化解耦,一键配置,方便实用,快快推广吧~

攻略

npm install mocker-api-json --save-dev

webpack dev文件

const path = require('path');

const webpack = require('webpack');

const merge = require('webpack-merge');

const BaseConfig = require('./webpack.base.js');

const apiMocker = require('mocker-api-json');
//webpack配置
mode: 'development',
  devServer: {
    host: '0.0.0.0',
    port: 9001,
    headers: {
      'Access-Control-Allow-Origin': '*'
    },
    historyApiFallback: {
      rewrites: [{
        from: /.*/g,
        to: '/www/view/index.html'
      }]
    },
    proxy: {
      '/api': {
        target: 'http://test01.test.com:8091/'
      }
    },
    before(app) {//此处是重点`!!!!!!!!!!!!!!!
      //https://www.webpackjs.com/configuration/dev-server/#devserver-before
      apiMocker.mockServer(app, path.resolve(__dirname, '../mock/index.js'));
    }
  },

mock/index.js文件

const json=require('mocker-api-json');
module.exports =json({
    mock:true,//全局打开mock
    dirname:__dirname,//当前文件路径
    baseUrl:'api/',//公共请求链接
    delay:10//延迟时间
});

额... 目前只加了这几个配置,后续提issues再加吧

Mock资源文件配置

52646541651634.png

json文件就这样

{
  "err_code": 0,
  "err_msg": "ok",
  "mock": true,//控制单个文件mock开关
  "data": {
    "poi": {
      "z_id": "111111111111",
      "name": "中国技术交易大厦大厦大厦",
      "province": "",
      "city": "北京市",
      "district": "海淀区",
      "longitude": 116.307499005,
      "latitude": 39.111,
      "addr": "",
      "category": "房产小区:商务楼宇",
      "category_code": 281200,
      "expiration_label": 0,
      "phone": ""
    }
  }
}

后记

大概就这些啦,如有问题yuwangi.github.io 联系我