vuepress学习系列/1/初次认识

vuepress 初识

之所以会了解到vuepress，是在学习element-ui源码时，想自己搭建一个elemen-ui那样的技术文档网站，因为可以运行的demo让element-ui和一般的技术站点显得更为友好。

翻了源码之后发现其使用vue-markdown-loader来加载markdown文档，按照这个原理，翻看vue-loader官网后,发现了vuepress。其提供的功能基本可以满足这样的需求。本着学习的态度，开启了vuepress学习之旅。

vuepress 能做什么

你看到的，vue、vue-loader、vue-router等 vue官方的文档,均是使用 vuepress 搭建的。

上手

开始前，先领取一份官方文档：https://vuepress.vuejs.org/zh/guide/

按照 快速上手 的步骤，安装并初始化

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

# 安装
yarn global add vuepress # 或者：npm install -g vuepress

# 创建项目目录
mkdir vuepress-starter && cd vuepress-starter

# 新建一个 markdown 文件
# 可能会导致乱码的问题
echo '# Hello VuePress!' > README.md

# 开始写作
vuepress dev .

# 构建静态文件
vuepress build .

问题：启动项目后，如果你遇到乱码的问题，请不要慌张，这是你新建的 README.md 文件乱码导致的，将文件编码修改成 utf-8 即可解决该问题。