当前位置:网站首页>Dumi builds a document blog
Dumi builds a document blog
2022-06-13 04:06:00 【Cun Yuyao】
Preface
I have already talked about how to use various open source frameworks on the Internet to build my own blog , such as docsify
、Hexo
、VuePress
、Halo
etc. . The first three can be matched directly Github
You can get your own blog for free , and Halo
You may need to have your own server , Then deploy the service in your own server .
When surfing the Internet recently , Found another documentation tool , That's it dumi
. Pronounce from Chinese pinyin , Namely Du mi . This is a documentation tool for developing scenarios for components , and father
Form a one-stop service .father
Responsible for building ,dumi
Is responsible for component development and generation of component documents , Together, it provides developers with a one-stop component development experience .
Let's have a look today , How to use it dumi
Build your own document based website .
dumi characteristic
Now that we need to use it dumi
, First, let's take a look at some of its features , It can be summarized as follows :
- Open the box , We just need to focus on component development and documentation .
- rich
Markdown
Expand , Not just rendering componentsdemo
. - be based on
TypeScript
The type definition , Can automatically generate componentsAPI
. - Support custom theme , You can also create your own
Markdown
Components . - Support mobile component library , The built-in mobile terminal makes money rendering scheme .
- One line command to complete the component asset digitization , Cascade downstream productivity tools .
Set up process
Primary preparation
Now that it's all said dumi
Is based on TypeScript
The type definition , How can I leave Node.js
Well ? therefore , Before the formal construction process , You have to make sure that your computer has Node.js
, And make sure that its version is not lower than 10.13
.
If you have already installed Node.js
, But I'm not sure about the version , Then use the following command to view .
node -v
Scaffold initialization
dumi
Two ways of initializing scaffolding are supported , One is component development scaffolding , The other is static site scaffold , This article mainly introduces how to use components to develop scaffolding .
Component development scaffolding includes more than dumi
And basic documentation , It also contains a simple component 、umi-test
and father-build
, It can easily realize component development 、 Documentation 、 Test case writing 、 The whole process of component packaging .
Create an empty folder locally , Easy to manage scaffolding , Then develop scaffolding in the component library that initializes a document pattern .
mkdir dumi-demo
cd dumi-demo
npx @umijs/create-dumi-lib
After initialization , Execute the following command , Then open in the browser http://localhost:8080
You can preview .
npx dumi dev
Document
Check out our project catalog , You can find docs
file , This is where we write the documentation . On project initialization , Only by default index.md
That is, we visited http://localhost:8080
What is called rendered in the page .
Then we are docs
Add and modify in the directory Markdown
file , It will help us automatically render to the front page .
summary
That's the use dumi
The specific process of building a document based website . Of course , Besides being a blog , We can also use it to develop front-end components , Keep adding new features to your site !
边栏推荐
- Lambda end operation find and match allmatch
- 微信扫描二维码无法下载文件的解决办法
- [web] cookies and sessions
- Introduction to RFM analysis
- 解答私信@田田WX //2022-6-12 C语言 51单片机LED模拟交通灯
- [test development] installation of test management tool Zen path
- MCU: NEC protocol infrared remote controller
- Single chip microcomputer: infrared remote control communication principle
- 2022 spring semester summary
- 单片机:Modbus 多机通信程序设计
猜你喜欢
史上最详细的Swin-Transformer 掩码机制(mask of window attentation)————shaoshuai
2022春学期总结
Principle, composition and functions of sensors of Dajiang UAV flight control system
5G China unicom 直放站 网管协议 实时性要求
基于PHP的轻量数码商城系统
Alipay native components (hotel time selection)
Common encryption and decryption function encapsulation - AES encryption and decryption
单片机:RS485 通信与 Modbus 协议
Interpretation of mobile phone private charging protocol
单片机:红外遥控通信原理
随机推荐
leetcode. 1 --- sum of two numbers
单片机:EEPROM介绍与操作
Use lodash to merge the values of the same fields in an array object
Uni app enables pull-up loading and pull-down refresh (pull-down with animation)
1.4.2 Capital Market Theroy
Advanced Mathematics (Seventh Edition) Tongji University exercises 1-2 personal solutions
Discussion sur la modélisation de la série 143
Fundamentals of robot obstacle avoidance system
GoFrame第五天
高等数学(第七版)同济大学 习题1-3 个人解答
Lambda终结操作查找与匹配findFirst
5g China Unicom ap:b SMS ASCII transcoding requirements
Manage PC startup items
Single chip microcomputer: a/d differential input signal
Lambda end operation collect
[test development] advanced part - Classification of various test technologies
微信扫描二维码无法下载文件的解决办法
EGO planner论文翻译
On the value of line height
Promise combined with await