#Quick Start

#1. Initialize the project

First, you can create a new directory with the following command:

mkdir modern-doc-app && cd modern-doc-app

Execute npm init -y to initialize a project. You can install Modern.js Doc using npm, yarn or pnpm:

npm install @modern-js/doc-tools typescript -D

Then create the file with the following command

mkdir docs && echo '# Hello World' > docs/index.md

Add the following script to package.json:

{
  "scripts": {
    "dev": "modern dev",
    "build": "modern build",
    "preview": "modern preview"
  }
}

Then initialize a configuration file modern.config.ts:

import docTools, { defineConfig } from '@modern-js/doc-tools';
import path from 'path';

export default defineConfig({
  doc: {
    root: path.join(__dirname, 'docs'),
  },
  plugins: [docTools()],
});

And then create tsconfig.json, add the following config:

{
  "compilerOptions": {
    "esModuleInterop": true,
    "jsx": "react-jsx"
  }
}

#2. Start Dev Server

Start the local development service with the following command:

npm run dev

#3. Build in Production

Build the production bundle with the following command :

npm run build

By default, Modern.js Doc will set doc_build as the output directory.

#4. Preview in local environment

Start the local preview service with the following command:

npm run preview