搭建可愛的Mix Space博客系統

Mix Space 是一款簡潔而不簡單的個人博客系統，它具有良好的動效設計，可愛的風格，以及比較豐富的功能。
它夠快，更現代，其活躍的開源社區能讓你享受到新技術棧帶來的驚艷。

環境準備:#

操作系統：建議最新的 Ubuntu / Debian ，或其他 Linux 內核版本不小於 4.19 的發行版本

Linux 內核版本：不小於 4.19 ，建議 5.x

內存建議：大於 1 GiB 內存要求說明:

構建需要的內存：大於 1 GiB
運行需要的內存：不小於 768 MiB

本站採用環境#

服務器 CentOS Linux release 7.9.2009 (Core) 內核版本 6.0.10-1.el7.elrepo.x86_64
Docker version 20.10.21+Docker-compose version 1.29.1
Node.js v16.18.1 npm v8.19.2 nvm v0.39.2

若使用操作系統為 Centos，默認內核版本可能並不符合要求，搭建前請先確認是否需要升級 Linux 內核版本#

環境準備#

安裝軟件包#

Debian / Ubuntu

apt update && apt install git curl vim wget git-lfs -y

CentOS

yum check-update && yum install git curl vim wget git-lfs -y

安裝 Docker#

SSH 連接到服務器，使用一鍵腳本，可以便捷地安裝 Docker 和 Docker Compose：

curl -fsSL https://get.docker.com | bash -s docker --mirror Aliyun

安裝 nvm 用於管理 Node.js 版本#

打開終端，使用一鍵腳本，可以便捷地安裝 nvm：

bash -c "$(curl -fsSL https://gitee.com/RubyKids/nvm-cn/raw/master/install.sh)"

重啟終端即可生效

安裝 Node.js 最新的 LTS 版本：

nvm install --lts

安裝需要的模塊：

npm i -g pnpm pm2

開始部署 Mix Space#

本站採取手動部署，更多部署方式請移步官方文檔 https://mx-space.js.org/

部署 Core#

Docker 部署#

#新建文件夾
cd && mkdir -p mx-space/core && cd $_
#拉取docker-compose.yml 文件
wget https://fastly.jsdelivr.net/gh/mx-space/core@master/docker-compose.yml
#拉取 Core 配置文件
wget https://fastly.jsdelivr.net/gh/mx-space/core@master/.env.example -O .env

編輯 .env 文件：

#THIS ENV FILE EXAMPLE ONLY FOR DOCKER COMPOSE
#SEE https://docs.docker.com/compose/environment-variables/#the-env-file
JWT_SECRET=7294c34e0b28ad28          #此處填寫一個長度不小於16個字符，不大於32個字符的字符串
ALLOWED_ORIGINS=test.cn,www.test.cn  #此處填寫被允許的域名，通常是kami的域名，如果允許多個域名訪問，用英文逗號,分隔

接下來就可以啟動後端啦

docker compose up -d

部署 kami Mix 默認前端#

拉取源文件#

cd && cd mx-space
git clone https://github.com/mx-space/kami.git --depth 1
#如果克隆緩慢，可以使用下面的鏡像地址
git clone https://github.1qi777.com/mx-space/kami.git --depth 1

切換到最新的 tag#

cd kami && git fetch --tags && git checkout $(git rev-list --tags --max-count=1)

拉取圖片文件#

git lfs fetch --all
git lfs pull
注意：如果無法正常拉取，可以到 GitHub 上手動下載文件並放到相應目錄。

配置文件#

複製 .env.example 為 .env

cp .env.example .env

編輯 .env 文件，它看起來應該是這個樣子的

#API 地址
NEXT_PUBLIC_API_URL=https://server.test.cn/api/v2
#GATEWAY 地址
NEXT_PUBLIC_GATEWAY_URL=https://server.test.cn
#前端使用的配置項名字
NEXT_PUBLIC_SNIPPET_NAME=kami
#如果使用 CDN, 修改產物前綴；一般留空
ASSETPREFIX=

構建#

這裡選用 pnpm 作為包管理器。

pnpm i

pnpm build

啟動前端#

pnpm prod:pm2
#可選
pm2 start