Getting Started

First, install MockKit CLI, the tool for using MockKit.

Requirements

• Node.js version 22 or later
• A project built with a static site generator (Next.js, Nuxt, 11ty, and others)
• A MockKit account (only when publishing)

Installation

You can use MockKit CLI without installing it:

npm

$ npx @mockkit/cli

yarn

$ yarn dlx @mockkit/cli

pnpm

$ pnpm dlx @mockkit/cli

To install it in your static site generator project:

npm

$ npm install --save-dev @mockkit/cli

yarn

$ yarn add -D @mockkit/cli

pnpm

$ pnpm add -D @mockkit/cli

You can also install it globally:

npm

$ npm install -g @mockkit/cli

yarn

$ yarn global add @mockkit/cli

pnpm

$ pnpm add -g @mockkit/cli

The sample commands below assume the following. If you use a different setup, adapt the commands as needed.

• Using MockKit CLI without installing it
• Using npm as the package manager

Examples

Here is an example of displaying the help output.

Without installation

npm

$ npx @mockkit/cli --help

yarn

$ yarn dlx @mockkit/cli --help

pnpm

$ pnpm dlx @mockkit/cli --help

Installed in the project

npm

$ npm exec mockkit --help

yarn

$ yarn exec mockkit --help

pnpm

$ pnpm exec mockkit --help

Installed globally

npm

$ mockkit --help

yarn

$ mockkit --help

pnpm

$ mockkit --help

Initial Setup

Run MockKit's initial setup in an existing project built with a static site generator.

$ cd /path/to/your/project
$ npx @mockkit/cli init

An interactive setup script runs.

✔ Enter the project name Your First Project
✔ Select the static site generator you are using Other (manual setup)
✔ Enter the destination directory ./dist
✔ Enter the public directory ./public
✔ Enter the development server port 3000
✔ Enter the development server command npm run dev
✔ Enter the static site generation command npm run generate
🎉 [SUCCESS] MockKit project initialized!
  mockkit.json created at /path/to/your/project/mockkit.json

Prompt	Description
Enter the project name	Enter the project name (site name).
Select the static site generator you are using	Select the static site generator used in this project. Currently only Nuxt can be selected; for anything else, choose manual setup (Other (manual setup)).
Enter the destination directory	Enter the directory where the static site generator outputs build results.
Enter the public directory	Enter the directory that serves as the site root for the static site generator (where you place files such as robots.txt).
Enter the development server port	Enter the port used by the static site generator's development server.
Enter the development server command	Enter the command to start the static site generator's development server.
Enter the static site generation command	Enter the command to build the static site with the static site generator.

When finished, mockkit.json is generated. The init command only outputs this file and does nothing else.

Starting the Development Server

$ npx @mockkit/cli dev

This command starts the development server.

Specifically, it starts both the static site generator's development server for the project and MockKit's Viewer server.

When it starts, output similar to the following appears in the terminal.

+-----------------------------------------+
| MockKit Viewer is running on port 8787. |
| Viewer URL: http://localhost:8787/~/    |
+-----------------------------------------+

The Viewer server starts on http://localhost:8787 by default. After startup, you can use MockKit's Viewer by visiting http://localhost:8787/~/ in your browser.