Prerequisition
- Node.js
- Open node.js CMD
- npm install npx
- npx create-docusaurus@latest my-website classic //create a website names my-website
error: no such file or directory, lstat 'C:\Users\qq\AppData\Roaming\npm'
solution: manually create the npm folder there - cd my-website
- npm start
Project structure
Assuming you chose the classic template and named your site my-website, you will see the following files generated under a new directory my-website/:
Assuming you chose the classic template and named your site my-website, you will see the following files generated under a new directory my-website/:
my-website
├── blog
│ ├── 2019-05-28-hola.md
│ ├── 2019-05-29-hello-world.md
│ ├── 2020-05-30-welcome.md
│ └── authors.yml //global author usersage: -name yimin
├── docs
│ ├── doc1.md
│ ├── doc2.md
│ ├── doc3.md
│ └── mdx.md
├── src
│ ├── components\homepagefeatures
| │ └── index.js //main page center
│ ├── css
│ │ └── custom.css
│ └── pages
│ ├── styles.module.css
│ └── index.js
├── static
│ └── img
├── docusaurus.config.js //main page
├── package.json
├── README.md
├── sidebars.js
└── yarn.lock
Project structure rundown
/blog/- Contains the blog Markdown files. You can delete the directory if you've disabled the blog plugin, or you can change its name after setting thepathoption. More details can be found in the [blog guide]/docs/- Contains the Markdown files for the docs. Customize the order of the docs sidebar insidebars.js. You can delete the directory if you've disabled the docs plugin, or you can change its name after setting thepathoption. More details can be found in the [docs guide]/src/- Non-documentation files like pages or custom React components. You don't have to strictly put your non-documentation files here, but putting them under a centralized directory makes it easier to specify in case you need to do some sort of linting/processing/src/pages- Any JSX/TSX/MDX file within this directory will be converted into a website page. More details can be found in the [pages guide]
/static/- Static directory. Any contents inside here will be copied into the root of the finalbuilddirectory/docusaurus.config.js- A config file containing the site configuration. This is the equivalent ofsiteConfig.jsin Docusaurus v1/package.json- A Docusaurus website is a React app. You can install and use any npm packages you like in them/sidebars.js- Used by the documentation to specify the order of documents in the sidebar
authors.yml
yimin:
name: Yimin Qiu
title: Helper & learner
url: https://github.com/tony20141
image_url: https://avatars.githubusercontent.com/u/60122866?s=400&u=04bd04ca632e625b294ee33c3f4f549b626b2c8c&v=4
Build
Docusaurus is a modern static website generator so we need to build the website into a directory of static contents and put it on a web server so that it can be viewed. To build the website:
npm run build
and contents will be generated within the /build directory, which can be copied to any static file hosting service like GitHub pages, Vercel or Netlify. Check out the docs on [deployment] for more details.
[SUCCESS] Generated static files in "build".
[INFO] Use npm run serve command to test your build locally.
