106 lines
4.0 KiB
Markdown
106 lines
4.0 KiB
Markdown
# Arcticnewone 个人网站
|
||
|
||
北极新一（Arcticnewone）的个人网站，提供个人介绍、作品集、工作室服务、动态资讯、工具箱与联系页面，是一个现代化的展示型站点。
|
||
|
||
## 技术栈
|
||
|
||
- [Nuxt 4](https://nuxt.com/) — 应用框架（服务端渲染 + 静态生成）
|
||
- [Vue 3](https://vuejs.org/) — 视图层
|
||
- [Tailwind CSS](https://tailwindcss.com/) — 样式方案（通过 `@nuxtjs/tailwindcss` 集成）
|
||
- [GSAP](https://gsap.com/) — 页面动画（配合 Lenis 平滑滚动）
|
||
- [Pinia](https://pinia.vuejs.org/) — 状态管理
|
||
- [@nuxtjs/i18n](https://i18n.nuxtjs.org/) — 国际化（中/英双语）
|
||
- [@nuxt/icon](https://nuxt.com/modules/icon) — 图标
|
||
- [pnpm](https://pnpm.io/) — 包管理器
|
||
|
||
## 本地开发
|
||
|
||
### 环境要求
|
||
|
||
- Node.js ≥ 20（推荐 22，与 Docker 构建镜像一致）
|
||
- pnpm ≥ 9
|
||
|
||
### 安装与启动
|
||
|
||
```bash
|
||
# 1. 安装依赖
|
||
pnpm install
|
||
|
||
# 2. 启动开发服务器（默认 http://localhost:3000）
|
||
pnpm dev
|
||
```
|
||
|
||
开发服务器启动后访问 http://localhost:3000，代码修改会热更新生效。
|
||
|
||
### 常用命令
|
||
|
||
| 命令 | 说明 |
|
||
| --- | --- |
|
||
| `pnpm dev` | 启动开发服务器 |
|
||
| `pnpm build` | 构建生产版本（生成 `.output/`） |
|
||
| `pnpm generate` | 静态站点生成（输出到 `dist/`） |
|
||
| `pnpm preview` | 本地预览生产构建 |
|
||
| `pnpm start` | 以 Node 方式启动 `.output/server/index.mjs` |
|
||
|
||
## 项目结构
|
||
|
||
```text
|
||
.
|
||
├── app/ # 应用源码（Nuxt 4 约定目录）
|
||
│ ├── app.vue # 应用入口（全局 SEO / Meta）
|
||
│ ├── assets/ # 静态资源（样式、图片等）
|
||
│ ├── components/ # 组件（common / home）
|
||
│ ├── composables/ # 组合式函数
|
||
│ ├── layouts/ # 布局
|
||
│ ├── pages/ # 页面（首页、工作室、作品、动态、工具、联系）
|
||
│ ├── plugins/ # 插件（如 Lenis 平滑滚动）
|
||
│ ├── stores/ # Pinia 状态
|
||
│ └── types/ # 类型定义
|
||
├── i18n/
|
||
│ └── locales/ # 国际化文案（zh.json / en.json）
|
||
├── public/ # 公开静态文件（favicon、robots.txt 等）
|
||
├── Dockerfile # 容器镜像构建
|
||
├── deploy/ # 生产部署配置（Kubernetes Deployment/Service/Ingress）
|
||
├── docker-compose.yml # 本地容器编排（使用 SWR 镜像）
|
||
├── nuxt.config.ts # Nuxt 配置（模块、i18n、Tailwind 等）
|
||
├── tailwind.config.js # Tailwind 配置
|
||
└── package.json # 项目依赖与脚本
|
||
```
|
||
|
||
## 构建与部署
|
||
|
||
构建并推送镜像：
|
||
|
||
```bash
|
||
./build-and-push.sh
|
||
```
|
||
|
||
脚本从环境变量读取 SWR 凭据（`SWR_REGISTRY`、`SWR_NAMESPACE`、`SWR_USERNAME`、`SWR_PASSWORD`），
|
||
多架构（`linux/amd64,linux/arm64`）构建并推送到华为云 SWR。
|
||
|
||
Dockerfile 基础镜像使用国内可访问的 DaoCloud 镜像源（`docker.m.daocloud.io/library/node:22-alpine`，Docker Hub 在国内不可达）。
|
||
|
||
本地启动（使用 SWR 镜像，与生产一致）：
|
||
|
||
```bash
|
||
docker compose up -d
|
||
```
|
||
|
||
生产部署使用 `deploy/` 目录下的 Kubernetes 配置（Deployment / Service / Ingress），
|
||
镜像统一推送到华为云 SWR（`swr.cn-north-4.myhuaweicloud.com/virtheart/arcticnewone:latest`），
|
||
部署与回滚步骤见 [deploy/README.md](deploy/README.md)。
|
||
|
||
## 国际化（i18n）
|
||
|
||
项目使用 `@nuxtjs/i18n` 实现中/英双语：
|
||
|
||
- 语言文件位于 `i18n/locales/`：`zh.json`（中文）、`en.json`（英文）
|
||
- 默认语言为中文（`defaultLocale: 'zh'`），URL 不包含语言前缀（`strategy: 'no_prefix'`），不自动探测浏览器语言
|
||
- 组件中通过 `useI18n()` 的 `t()` 方法读取文案，例如 `t('nav.home')`
|
||
|
||
新增文案时，在 `zh.json` 和 `en.json` 中同步添加对应键即可。
|
||
|
||
## 说明
|
||
|
||
本项目不含任何密钥或敏感信息；本地环境变量请使用 `.env` 文件（已被 `.gitignore` 忽略）。
|