📒 笔记
如何下载到本地
废话不多说,我们开始下载的步骤吧。
如果你没有熟练掌握诸如命令行和 Git 的使用,我们在这里建议你使用 GitHub 本身提供的 下载源代码存档 功能直接从 GitHub 站点上下载打包好的压缩文件包,然后到本地解压后查看和使用。
如果你掌握了命令行和 Git 的使用,可以通过下面的命令克隆项目仓库到名为 nolebase 的目录中:
git clone https://github.com/Lintern/obsidian-notes使用的是 Windows 吗
注意
如果你使用的是 Git for Windows ,那么可能会在执行上述命令时,遇到类似这样的报错:
PS D:\> git clone https://github.com/Lintern/obsidian-notes
...
error: invalid path 'x: xxx.md'
fatal: unable to checkout working tree
warning: Clone succeeded, but checkout failed.
You can inspect what was checked out with 'git status'
and retry with 'git restore --source=HEAD :/'这是 Git for Windows 的默认配置导致的问题。
你可以在命令行窗口中输入下面的命令来解决这个问题:
git config --global core.protectNTFS false如何使用、运行或者部署
完成了下载了吗?很好,恭喜你已经完成了很艰难的一步!
正如先前介绍过
因此你需要先配置一下 Node.js 和添加和管理 VitePress 和 Vue 作为底层管理依赖的工具 pnpm 。
准备工作
所以你在继续下面的步骤之前,需要完成另外的两件事情:
- 安装和配置 Node.js,要校验 Node.js 是否安装成功,可以通过打开命令行窗口然后运行
node --version和npm --version来查看是否会报错; - 安装和配置 pnpm,要校验 pnpm 是否安装成功,可以通过打开命令行窗口然后运行
pnpm --version。
使用的是 Windows 吗
注意
如果你使用的是 Windows,可以选择通过 scoop(一款在 Windows 上面向开发者可用的包管理器)来安装这些必要的工具,这样可以避免在 Windows 上面安装和配置这些工具的时候遇到的一些问题。
想要快速安装 Scoop,使用 Win + Q 打开搜索,键入「Powershell」之后点击搜索结果中的蓝色方块,然后输入下面的命令:
Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope CurrentUserInvoke-RestMethod -Uri https://get.scoop.sh | Invoke-Expression使用 Win + Q 打开搜索,键入「Powershell」之后点击搜索结果中的蓝色方块,然后输入下面的命令:
node --version如果你看到了类似于 vxx.xx.xx 的版本号(比如 v21.1.0),那么恭喜你,你已经成功安装了 Node.js。
如果没有看到,那么你需要先安装 Node.js。如果采用了上面提到的 scoop,可以使用下面的命令来安装 Node.js:
scoop install nodejs注意
由于我们使用到了 sharp 这个依赖来生成图片,而 sharp 依赖需要使用到 Python,因此你也需要安装 Python。
如果采用了上面提到的 scoop,可以使用下面的命令来安装 Python:
scoop install python接下来让我们来安装 pnpm,使用下面的命令来安装 pnpm:
corepack enablecorepack prepare pnpm@latest --activate首次安装完成之后需要运行一下
pnpm setup来配置 pnpm 所需要的目录,完成之后需要关掉当前的 Powershell 窗口,然后重新打开一个新的 Powershell 窗口。
差不多准备好啦,让我们前往 Nólëbase 知识库所在的目录吧,使用下面的命令来前往 Nólëbase 知识库所在的目录:
cd先多输入一个空格,然后接下来打开文件管理器,把你解压缩完成的 Nólëbase 知识库文件夹拖拽到运行窗口中,最后按下 回车 键,就可以告诉 Powershell 前往 Nólëbase 知识库所在的目录了。
使用的是 macOS 吗
注意
如果你使用的是 macOS,可以选择通过 Homebrew(一款在 macOS 上面向开发者可用的包管理器)来安装这些必要的工具,这样可以避免在 macOS 上面安装和配置这些工具的时候遇到的一些问题。
想要快速安装 Homebrew,使用 command + 空格 打开「终端」应用,然后输入下面的命令:
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"使用 command + 空格 打开「终端」应用,然后输入下面的命令:
node --version如果你看到了类似于 vxx.xx.xx 的版本号(比如 v21.1.0),那么恭喜你,你已经成功安装了 Node.js。
如果没有看到,那么你需要先安装 Node.js。如果采用了上面提到的 Homebrew,可以使用下面的命令来安装 Node.js:
brew install node接下来让我们来安装 pnpm,使用下面的命令来安装 pnpm:
corepack enablecorepack prepare pnpm@latest --activate首次安装完成之后需要运行一下
pnpm setup来配置 pnpm 所需要的目录,完成之后需要关掉当前的终端窗口,然后重新打开一个新的终端窗口。
差不多准备好啦,让我们前往 Nólëbase 知识库所在的目录吧,使用下面的命令来前往 Nólëbase 知识库所在的目录:
cd先多输入一个空格,然后接下来打开访达,把你解压缩完成的 Nólëbase 知识库文件夹拖拽到终端窗口中,最后按下 return 键,就可以告诉终端前往 Nólëbase 知识库所在的目录了。
使用的是 Linux 吗
你既然已经在使用 Linux 了,应该知道怎么做了吧?
安装依赖和运行开发服务器
在倒数第二步中,我们需要安装依赖,这样 VitePress 和 Vue 就会被下载到本地的 Nólëbase 目录/文件夹下的 node_modules 目录/文件夹下了:
pnpm install接下来你可以直接运行下面的命令开启一个本地运行的 Nólëbase 知识库前端服务器,通常而言我们称之为「开发服务器」,用这个服务器,可以通过浏览器在本地直接访问渲染完成的页面:
pnpm docs:dev就像这样
$ pnpm docs:dev
vitepress v1.0.0-rc.20
➜ Local: http://localhost:5173/
➜ Network: use --host to expose
➜ press h to show help当你看到上面的字样的时候,就可以前往本地的 http://localhost:5173 查看渲染完成的页面了:
在这个本地运行的 Nólëbase 知识库前端服务器启动的情况下,你针对所有 Markdown 文件、样式文件、配置文件的变更,都会实时响应到网页中。
如果刷新不及时或者更新有异常,也可以试试看使用 command + R (macOS 系统) Ctrl + R (Windows 和 Linux 系统)快捷键强制刷新。
构建并渲染为可部署的静态页面
想要部署页面,首先先确保你已经执行过了安装依赖和运行开发服务器 的步骤,一般而言构建和渲染的时候可能遇到的问题都可以在运行开发服务器的时候发现,接下来你只需要一个简单的命令就能完成构建了:
pnpm docs:build构建完成后,渲染出来的 HTML 和各种资源将会被存储在 .vitepress/dist 目录下面,你可以通过上传 .vitepress/dist 目录来完成 Nólëbase 知识库的部署。
使用静态网站托管服务部署页面
Nólëbase 知识库使用 VitePress 静态生成器来驱动和生成静态页面,因此可以部署到下列已知的优质静态网站托管服务:
NOTE
与自建单独的虚拟机并使用类似于 Nginx,或者对象存储(OSS)相比,使用上述提及的静态网站托管服务时,可以省略手动部署流程,也无需花费时间与精力维护单独的网站服务器。
让我们把精力放在写作上吧!❤️
请参照 VitePress 官方文档的部署 VitePress 站点页面文档所介绍的内容,通过主流的静态网站托管服务来部署自己的 Nólëbase 知识库。