「奇怪的教程」年轻人的第一个博客搭建指南

「奇怪的教程」年轻人的第一个博客搭建指南

开始前要说的话

当你有意识想要为自己搭建一个个人博客时，我相信你已经步入了开发者这扇门，也许你的技术没有非常强劲，或者你和我一样对于前端技术了解的很少，你在接下来的搭建过程中可能会出现一些问题，这些问题很有可能没有完全的记录在我的教程中，但是请一定要记得：

::: tip

遇见了问题请不要抱怨，尝试自己解决他，利用你的翻译软件和搜索软件，找到问题的关键，处理它，自己动手把坑填上 ：）

:::

用到的技术和知识

vuepress：基于Markdown的前端网站生成器，awesome，简单易用，不需要掌握太多前端技术也可以快速搭建

vuepress-theme-hope：一个具有强大功能的 vuepress 主题，封装好了很多功能，即使前端不是很熟悉，也可以快速上手

markdown语法：这个网上教程很多，语法也很简单，本文也是使用markdown进行撰写的，这个必须要了解

官方文档

最好的教程当然是官方文档

quickstart

安装nodejs

下载nodejs，要求版本大于8.6，傻瓜式安装，一路next

# 测试安装是否成功
# 如果win10环境提示无此命令，先检查环境变量中nodejs命令的路径是否正常，然后尝试重启电脑
node -v
npm -v
# 正常输出代表安装成功

helloworld

# 选择一个合适的路径，创建并进入一个新目录
mkdir vuepress-starter && cd vuepress-starter

# 初始化项目，-y会自动帮你生成好相关内容
# npm不太懂没关系，我们的重心不在这，大致理解就是我们的项目基于npm运行，这一步是初始化
npm init -y 

# 安装vuepress
# 如果你的环境安装正确
# 这一步结束你会发现给你的目录生成了一些文件
# 不要慌，现在你可以不知道这些文件和目录的作用
npm install -D vuepress

# 创建docs目录
# 需要你记住的是
# docs简单理解就是放你各种工作文件的地方，类似于java的src目录
右击在当前目录新建一个docs文件夹 or mkdir docs

# 进入docs，新建一个README.md文件
# 在你的README.md中写上: # Hello World!

# 修改你主目录的package.json文件，设置你的启动命令
# 你可以不配置，但是我推荐你这么做，因为配置了这是能少打几个字，方便点
# 找到scripts，不要动里面的其他东西，往里面加两行
"dev": "vuepress dev docs",
"build": "vuepress build docs"

# 然后启动！
npm run dev

# 等