前言
WARNING
你需要明白,建站本身并不是一件很难的事,真正难的是你对网站的定位,网站内容的质量把控,网站提供给用户价值的大小,持续的内容输出以及运营。
另外你还需要知道,建站是有成本的,几百,几千到几万都有,每个网站的情况不同。
在开始使用实践之前,你需要注意,自建网站需要一定的相关知识,你可能会遇到一系列的问题,请确保你有独立解决问题的能力。
安装 / 开发
下载
这一步需要您的设备具有 Git 环境,并且能够连接到 GitHub。具体解决方法将不在此处赘述。
没有Git环境怎么办?请自行上网搜索,文档不会讲那么详细,如果你Git装不明白那说明你没有独立解决问题的能力,你不适合查看这个文档
将仓库 clone
下来:
# 这里可以采用你自己的仓库地址
git clone git@github.com:imsyy/vitepress-theme-curve.git
然后 cd
到主题目录:
cd vitepress-theme-curve
接下来就是安装依赖了。
安装依赖
这一步需要您的设备具有 Nodejs 环境,并且有一个良好的网络连接。具体安装方法将不在此处赘述。
建议使用
pnpm
,若未安装,可使用npm install pnpm -g
来安装。
WARNING
本主题依赖于 Node 18.x 及以上版本,请注意你本地的 Node 环境版本是否符合
确保您已经安装了 pnpm
,然后主题根目录打开终端并执行以下命令:
pnpm install
开发模式
在主题根目录打开终端并执行以下命令:
pnpm dev
然后在浏览器打开 localhost:9877 即可预览主题。
请注意,处于开发模式时,文章内容或样式的变更会自动进行热重载,但是新建文章或者更改文章标题等操作将不会自动热重载,你需要手动进行停止并重新运行。
如何编辑内容
建议使用VSCode编辑器进行内容编辑 点我下载VSCode
具体切换中文教程等请自行上网查询
书写新的文章
你可以直接在站点根目录中的 posts
文件夹中直接新建 markdown
文件来书写,您的文件路径即为实际生成的网址路径。
添加新的页面
你可以直接在站点根目录中的 pages
文件夹中直接新建 markdown
文件来实现新建页面,您的文件路径即为实际生成的网址路径。
主题中已经内置了几个常用页面以供参考。
主题配置
本主题提供了一个 themeConfig.mjs
文件用来配置,它位于 .vitepress\theme\assets\themeConfig.mjs
,你可以将它复制一份并移动至根目录中,在这里里面的修改将会覆盖初始配置
请注意,请不要更改文件名或者删除原配置文件,否则它将会不起作用!
静态文件
通常情况下,静态文件处于根目录下的 public
文件夹中,通常用于存放字体或图片等文件信息。
了解更多:资源处理
部署
本地部署
部署一个静态站点最简单的也是最直接的方式。
- 执行
build
命令来进行静态文件打包:
pnpm build
如果这个过程中没有出现报错,那么就会在你的项目根目录下的 .vitepress/dist
文件夹中生成可供访问的静态站点源码,可以将这些文件放在任意可供显示静态站点的地方。
Vercel 部署
相信大部分小伙伴使用静态博客都是用的 Vercel
部署,所以主题已经内置了对于 Vercel
部署的支持,你可以在 Vercel
网页端直接导入仓库来实现自动部署。
当然,如果你不想使用 GitHub
,也可直接在根目录中直接执行部署命令,Vercel CLI
会指引您完成部署。
pnpm deploy:vercel
随后在 Vercel
中配置自定义域名即可完成整个部署流程。