1. 前端数据 mock

1.1. Json Server 创建本地 json 文件作为数据库

1.2. Faker.js 产生数据

1.3. 具体步骤

1.3.1. 1. Declare Schema

Test schema at http://json-schema-faker.js.org

install packages: npm i json-schema-faker json-server --save-dev

// create buildScripts/mockDataSchema.js
var schema = {
  type: 'object',
  properties: {
    users: {
      type: 'array',
      minItems: 3,
      maxItems: 5,
      items: {
        type: 'object',
        properties: {
          id: {
            type: 'number',
            unique: true,
            minimum: 1,
          },
          firstName: {
            type: 'string',
            faker: 'name.firstName',
          },
          lastName: {
            type: 'string',
            faker: 'name.lastName',
          },
          email: {
            type: 'string',
            faker: 'internet.email',
          },
        },
        required: ['id', 'type', 'lastname', 'email'],
      },
    },
  },
  required: ['users'],
};

module.exports = schema;

1.3.2. 2. Generate Random Data

// create buildScripts/generateMockData.js

/* This script generates mock data for local development.
   This way you don't have to point to an actual API,
   but you can enjoy realistic, but randomized data,
   and rapid page loads due to local, static data.
 */

var jsf = require('json-schema-faker');
var mockDataSchema = require('./mockDataSchema');
var fs = require('fs');

var json = JSON.stringify(jsf(mockDataSchema));

fs.writeFile('./src/api/db.json', json, function(err) {
  if (err) {
    return console.log(err);
  } else {
    console.log('Mock data generated.');
  }
});

in package.json

"generate-mock-data": "node buildScripts/generateMockData"

1.3.3. 3.  Serve Random Data

package.json: if prestart-mockapi is used, data will be regenerated everytime npm run start-mockapi.

"generate-mock-data": "node buildScripts/generateMockData",
"prestart-mockapi": "npm run generate-mock-data",
"start-mockapi": "json-server --watch src/api/db.json --port 3001"

run the mock server: npm run start-mockapi

Copyright © Guanghui Wang all right reserved,powered by GitbookFile Modified: 2019-08-25 13:56:34

results matching ""

    No results matching ""