Getting Started

Install the core package using your preferred package manager:

npm install mock-config-server

Mock Config can mock REST, GraphQL, and WebSocket flows with the same config, so you can keep one predictable setup for local development and tests.

1. Create your config

Create a ./mock-server.config.(ts|mts|cts|js|mjs|cjs) file and export the server configuration as default. The mock(...) helper keeps the config compact and typed. This is the default file path, but you can change it by cli run arg.

import { mock, rest } from 'mock-config-server';

type User = {
  id: number;
  name: string;
  role: 'admin' | 'developer' | 'qa';
};

export default mock(
  {
    port: 7777,
    baseUrl: '/api'
  },
  {
    name: 'rest',
    configs: [
      rest.get<{ response: User[] }>('/users', [
        { id: 1, name: 'John', role: 'admin' },
        { id: 2, name: 'Jane', role: 'developer' }
      ]),
      rest.get<{ params: { id: string }; response: User }>('/users/:id', ({ request }) => ({
        id: Number(request.params.id),
        name: 'John',
        role: 'admin'
      }))
    ]
  }
);

2. Start the mock server

Run the CLI and your mocks will be available on http://localhost:7777:

npx mock-config-server

If the package is already installed, you can use the short command mcs

3. Try your mocks

Run a request

Use one of the examples below to make a request and confirm that the mock server responds with your configured data.

const users = await fetch('http://localhost:7777/api/users').then((response) => response.json());

console.log(users);

4. Test your mocks

Like any good quick start, it helps to prove the setup in a test runner right away.

Start the server

Keep the mock server running while your test makes requests to the endpoint.

npx mock-config-server

Write a test

Create a small Vitest test that calls the running mock server and checks the response.

import { expect, test } from 'vitest';

test('returns mocked users', async () => {
  const response = await fetch('http://localhost:7777/api/users');
  const data = await response.json();

  expect(data).toEqual([
    { id: 1, name: 'John', role: 'admin' },
    { id: 2, name: 'Jane', role: 'developer' }
  ]);
});

Run test

Run the test file.

npx vitest

Expected output

If everything is configured correctly, you should see a passing result like this:

+ test/example.test.ts (1 test) 1ms
  + responds with the user 0ms

Test Files  1 passed (1)
     Tests  1 passed (1)
  Start at  06:03:11
  Duration  166ms (transform 19ms, setup 0ms, collect 7ms, tests 1ms, environment 0ms, prepare 43ms)

Next Steps

This guide is a good starting point, but you can do much more with Mock Config.

Continue learning

Core functionality