VuePress搭建个人博客，你值得拥有！

前言

看见大部分前端人都有自己博客，骤然发现自己还没有自己的博客，这可不行！别人有的 我也要有！

ps:我有自己的域名和服务器。

本文详细说了自己如何快速使用VuePress快速搭建个人博客，看完不会打你的！

1. 前期准备

在开始之前，你需要确保已经安装了以下软件：

• Node.js (v12.x 或更高)
• Vue CLI (v4.x 或更高)

如果你还没有安装这些软件，请按照以下步骤进行安装：

• 安装 Node.js：
  • 下载并安装 Node.js 安装程序：https://nodejs.org/en/download/
  • 按照安装程序的说明进行安装
• 安装 Vue CLI：
  • 打开终端或命令提示符
  • 运行以下命令：

npm install -g @vue/cli

2. 创建项目

打开终端或命令提示符，并导航到你想创建博客的目录。然后运行以下命令：

vue create my-blog

这将创建一个新的 VuePress 项目。

3. 安装主题

VuePress 有很多主题可供选择。你可以选择一个你喜欢的主题，并将其安装到你的项目中。

要在你的项目中安装主题，请运行以下命令：

vuepress install @vuepress/theme-default

这将安装默认主题。你也可以安装其他主题，例如：

vuepress install @vuepress/theme-blog

4. 配置项目

你需要对你的项目进行一些配置，才能开始编写博客文章。

要配置你的项目，请打开项目根目录下的 config.js 文件。

在这个文件中，你可以配置以下选项：

• 站点标题
• 站点
• 站点语言
• 主题选项

你还可以添加自定义 CSS 和 JavaScript 文件。

5. 编写博客文章

要编写博客文章，请在项目根目录下的 docs 目录下创建一个新的 Markdown 文件。

在 Markdown 文件中，你可以使用 Markdown 语法来编写你的文章。

你也可以在你的文章中添加 HTML、CSS 和 JavaScript 代码。

6. 预览和部署博客

要预览你的博客，请运行以下命令：

vuepress dev

这将在你的本地计算机上启动一个开发服务器。你可以在浏览器中打开 http://localhost:8080 来预览你的博客。

要部署你的博客，你可以使用以下命令：

vuepress build

这将在项目根目录下创建一个 dist 文件夹。你可以将这个文件夹上传到你的服务器上，以使你的博客在线可用。

7. 结语

现在你已经学会了如何使用 VuePress 快速搭建个人博客。希望你能用它来分享你的技术知识和经验。

如果你有任何问题，请随时在评论区留言。