外观
2、我要建博客之第一步
想拥有自己的小博客但怕代码劝退?哪怕是小白,亲测这套流程超简单!跟着做,半小时就能在电脑上跑起自己的博客~重要的是行动!👇
✅ 第一步:安装开发工具(VsCode)
这是写代码的 “记事本”,新手友好度极高。
用豆包或其他 AI 工具搜索「VsCode」,点击官网链接下载,选择与自己电脑匹配的系统(Windows/Mac)。
安装过程中,务必勾选「添加到 PATH」选项,否则后续操作可能会遇到问题。
打开 VsCode 后,搜索「Chinese」插件并安装,重启软件即可切换为中文界面。
✅ 第二步:安装 Node.js
Node.js 是博客运行所需的 “小引擎”,按步骤操作即可完成。
用豆包搜索「Node.js」,选择下载 LTS 长期支持版,该版本稳定性更高,不易出错。
安装时无需修改默认选项,一路点击 “下一步” 即可。
验证安装是否成功:打开 VsCode 的「终端」(通过顶部菜单 “查看→终端” 找到),输入node -v,若能显示版本号则说明安装成功。
✅ 第三步:安装博客框架(VuePress)
选择 VuePress 是因为它无需编写复杂代码,用 Markdown 就能发布文章。Markdown 的核心优势是简单易上手、跨平台兼容且专注内容创作,无需复杂排版操作就能生成结构化文档,类似写论文时用到的 LaTex。
先在电脑中新建一个文件夹,建议命名为「blog」,并记住文件夹的保存路径。
在 VsCode 中通过 “文件→打开文件夹”,选择并打开刚才新建的「blog」文件夹。
在终端中输入命令进行安装,具体操作可参考 VuePress 官方指南,核心命令为:
npm init vuepress vuepress-starter✅ 第四步:运行博客项目
完成这一步,就能让博客在电脑上 “跑起来”。
在终端中输入命令:npm vuepress dev docs
等待终端显示「success」后,复制下方出现的链接(通常为http://localhost:8080)。
将复制的链接粘贴到浏览器地址栏,即可看到博客的初步雏形。🥳
✅ 第五步:撰写第一篇博客文章
用 Markdown 格式写作,操作像记笔记一样简单。
在 VsCode 中打开「docs」文件夹,在该文件夹下新建一个「blog」文件夹。
在新建的「blog」文件夹中创建文件,命名为「我的第一篇博客.md」。
按照 Markdown 语法撰写内容,例如用# 标题表示一级标题、## 小标题表示二级标题、- 列表项表示列表,完成后保存文件。
✅ 第六步:再次运行查看效果
刷新博客页面,就能看到新写的文章。✨
注:是热更新,你每敲一个字都会看到结果。
版权所有
版权归属:wgz1995