* fixed look of links in blockquote * updated main README * updated getting started * updated more-pages * make custom sidebar loading clear * updated custom navbar * added markdown comments * updated cover documentation * updated cover page * updated sidebar
1.9 KiB
Quick start
It is recommended to install docsify-cli globally, which helps initializing and previewing the website locally.
npm i docsify-cli -g
Initialize
If you want to write the documentation in the ./docs directory, you can use the init command.
docsify init ./docs
Writing content
After the init is complete, you can see the file list in the docs directory.
index.htmlas the entry fileREADME.mdas the home page.nojekyllprevents GitHub Pages from ignoring files that begin with an underscore
You can easily update the documentation in docs/README.md, of course you can add more pages.
Preview your site
Run the local server with docsify serve. You can preview your site in your browser on http://localhost:3000.
docsify serve docs
?> For more use cases of docsify-cli, head over to the docsify-cli documentation.
Manual initialization
If you don't like npm or have trouble installing the tool, you can manually create index.html:
<!-- index.html -->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="//unpkg.com/docsify/themes/vue.css">
</head>
<body>
<div id="app"></div>
</body>
<script src="//unpkg.com/docsify"></script>
</html>
If you installed python on your system, you can easily use it to run a static server to preview your site.
cd docs && python -m SimpleHTTPServer 3000
Loading dialog
If you want, you can show a loading dialog before docsify starts to render your documentation:
<!-- index.html -->
<div id="app">Please wait...</div>
You should set the data-app attribute if you changed el:
<!-- index.html -->
<div data-app id="main">Please wait...</div>
<script>
window.$docsify = {
el: '#main'
}
</script>