Docs

Deploy Docusaurus Sites with Vercel

Docusaurus with Vercel makes it easy to create and deploy open source project documentation.

Check out the Live Demo or...

Docusaurus is a documentation framework that makes it easy to maintain open-source documentation websites. This guide covers how to deploy a Docusauras v2 site.

Prerequisites

  • Node.js version >= 14.x
  • Npm version >= 5.2.0
  • Yarn version >= 1.5.0

Step 1: Set Up Your Docusaurus Project

Begin by setting up a new Docusaurus project with npx:

npx create-docusaurus@latest website classic

Scaffold a Docusauras project with npx.

This will scaffold out a new project named website in your current directory. The project structure should resemble the following:

website
├── blog
│ ├── 2019-05-28-hola.md
│ ├── 2019-05-29-hello-world.md
│ └── 2020-05-30-welcome.md
├── docs
│ ├── doc1.md
│ ├── doc2.md
│ ├── doc3.md
│ └── mdx.md
├── src
│ ├── css
│ │ └── custom.css
│ └── pages
│ ├── styles.module.css
│ └── index.js
├── static
│ └── img
├── docusaurus.config.js
├── package.json
├── README.md
├── sidebars.js
└── yarn.lock

Step 2: Push the new site to GitHub

Create a new Git repository, add and commit your work and push the changes. You can create a new repository from the GitHub UI, once done, enter the following commands in your terminal:

git init
git remote add origin <your-repository>
git branch -M main
git add .
git commit -m "init"
git push -u origin main

Step 3: Deploy your Docusaurus website with Vercel

To deploy your Docusaurus site with Vercel for Git, make sure it has been pushed to a Git repository.

Import the project into Vercel using your Git provider of choice:

After your project has been imported, all subsequent pushes to branches will generate Preview Deployments, and all changes made to the Production Branch (commonly "main") will result in a Production Deployment.

Once deployed, you will get a URL to see your site live, such as the following: https://docusaurus.examples.vercel.com

Set up a Docusaurus site with a few clicks using the Deploy button, and create a Git repository for it in the process for automatic deployments for your updates.



Written By
Written by mcsdevmcsdev
Written by moleboxmolebox