快速使用VuePress创建StaticWeb,并部署到GithubPages
VuePress是一个非常简单易用的静态网站生成器,官方贴心地提供了两种快速入手的方法:
- 全局安装:试玩专用;
- 在项目上添加:干大事必备(想认真搭web的直接跳到这)
两种方法不巧我都试了,下面为大家简单地介绍一下。
1. 全局安装(试玩专用)
参考vuepress-快速入手,在控制台下进行全局安装。
这里注意官方提示:
如果你只是想尝试一下 VuePress,你可以全局安装它:
这句话的意思是:
只使用这种办法的话,你什么都干不了;
如果你想要认真建web,请使用第二种办法。
但是它给了办法,咱就先试一下:
# 安装
yarn global add vuepress # 或者:npm install -g vuepress
# 创建项目目录
mkdir vuepress-starter && cd vuepress-starter
# 新建一个 markdown 文件
echo '# Hello VuePress!' > README.md
# 开始写作
vuepress dev .
# 构建静态文件
vuepress build .
运行成功后提示:
success [00:56:14] Build de40f6 finished in 6825 ms!
> VuePress dev server listening at http://localhost:8080/
点击打开:http://localhost:8080/
vuepress全局安装效果如上,没有然后。
2. 在项目上添加(干大事从这开始)
参考vuepress-快速入手,在现有项目上进行添加的步骤:
# 将 VuePress 作为一个本地依赖安装
yarn add -D vuepress # 或者:npm install -D vuepress
# 新建一个 docs 文件夹
mkdir docs
# 新建一个 markdown 文件
echo '# Hello VuePress!'