dumi搭建个人文档

介绍

dumi是阿里开源的、为组件开发场景而生的文档工具。

特性

• 📦 开箱即用，将注意力集中在组件开发和文档编写上
• 📋 丰富的 Markdown 扩展，不止于渲染组件 demo
• 🏷 基于 TypeScript 类型定义，自动生成组件 API
• 🎨 主题轻松自定义，还可创建自己的 Markdown 组件
• 📱 支持移动端组件库研发，内置移动端高清渲染方案
• 📡 一行命令将组件资产数据化，与下游生产力工具串联

安装

选择文档模式、就不做复杂的站点模式了

//模板项目
yarn create @umijs/dumi-lib
//安装依赖
yarn
//启动
yarn start
//打包
yarn docs:build

配置

如果上传到自己服务器不需要更改此处.umirc.ts

如果上传到Github Pages、需要 非根目录部署

import { defineConfig } from 'dumi';

export default defineConfig({
  title: '继教网前端',
  favicon: 'https://user-images.githubusercontent.com/9554297/83762004-a0761b00-a6a9-11ea-83b4-9c8ff721d4b8.png',
  logo: 'https://user-images.githubusercontent.com/9554297/83762004-a0761b00-a6a9-11ea-83b4-9c8ff721d4b8.png',
  outputPath: 'docs-dist',
  // more config: https://d.umijs.org/config
  base:'/仓库名/' ,
  publicPath: '/仓库名/',
  exportStatic: {},
});

使用

在docs文件夹下建文件夹和目录即自动生成路由、生成的源文件在src文件夹里

注意只能建.md的markdown语法文件夹

打包上线

预览：http://imberzsk.gitee.io/dumi-react