通用企业官网程序

基于 Nuxt 4 + Vue 3 + TypeScript 的企业官网纯前端展示系统。

项目定位

• 本项目仅包含官网前台展示代码
• 不含后端管理端，所有数据通过调用 SaaS 后端 API 获取
• 支持多模板切换、多租户、独立域名绑定、订阅过期校验

目录结构

website/
├── app/                    # 应用代码
│   ├── components/         # 公共组件
│   ├── composables/        # 组合式函数
│   ├── layouts/            # 布局
│   ├── pages/              # 页面路由
│   ├── templates/          # 模板集合
│   ├── types/              # TS 类型
│   ├── utils/              # 工具函数
│   └── assets/             # 样式资源
├── server/                 # Nuxt Server
│   ├── api/                # API 代理
│   ├── middleware/         # 中间件
│   └── utils/              # 服务端工具
├── scripts/                # 脚本
└── templates/cloud-website # 模板预览图

安装依赖

npm install

本地开发

npm run dev

默认访问：http://localhost:3000

环境变量与打包

项目已按环境拆分配置文件，打生产包不再需要手改 .env：

命令	用途	读取的配置
npm run dev	本地开发	.env.development
npm run build:prod	生产打包	.env.production
npm run build	等同 build:prod	.env.production
npm run build:dev	用开发配置打包（排查用）	.env.development
npm run dev:prod	以生产配置本地起服务（排查用）	.env.production

配置文件说明：

文件	是否提交	说明
.env.development	✅	团队共享的开发配置，接口指向本地后端
.env.production	✅	团队共享的生产配置，接口指向线上
.env.example	✅	变量总览模板，新增变量时同步更新
.env.local	❌	个人通用覆盖
.env.<环境>.local	❌	个人针对某环境的覆盖，优先级最高
.env	❌	历史遗留的个人配置，优先级最低

优先级（高 → 低）： 进程环境变量 > .env.<环境>.local > .env.<环境> > .env.local > .env

只有「变量尚未定义」时才会被下一层填充，因此高优先级不会被低优先级顶掉， .env 里残留的本地地址也不会再污染生产包。

发布前可自查产物是否干净：

grep -rl "127.0.0.1" .output/ || echo "产物干净，无本地地址"

模板系统

模板存放在 app/templates/ 目录下，每个模板独立目录，包含：

• config.ts：模板配置
• components/：模板私有组件（Header、Footer 等）
• pages/：模板页面组件
• theme.css：模板主题变量

当前已实现：

• template-01：科技蓝企业模板（完整）
• template-02 ~ template-04：占位模板，后续根据设计稿实现

环境变量清单

完整变量说明见 .env.example。核心变量：

# 租户 / 模板（生产留空，由域名自动识别）
NUXT_PUBLIC_TENANT_ID=
NUXT_PUBLIC_APP_ID=website
NUXT_PUBLIC_TEMPLATE_ID=

# 接口地址
NUXT_PUBLIC_SERVER_API_BASE=https://server.websoft.top/api
NUXT_PUBLIC_MODULES_API_BASE=https://hjc-api.websoft.top/api
NUXT_PUBLIC_APP_API_BASE=https://websopy-api.websoft.top

# 多租户域名
NUXT_PUBLIC_BASE_DOMAINS=shoplnk.cn,sitelink.cn,wsdns.cn

ℹ️ nuxt.config.ts 内置的 NUXT_PUBLIC_MODULES_API_BASE 默认值已统一为 https://hjc-api.websoft.top/api（原 cms-api.websoft.top 域名 /api/* 已返回 404， 故全面切换到 hjc-api）。.env.production 中也显式指定同一地址。 若将来再次更换域名，请同步修改 nuxt.config.ts、.env.production 与 .env.example。

接口说明

本项目通过 server/api/ 代理转发 SaaS 后端接口，前端不直接调用后端地址。

核心接口：

• GET /api/site/info：站点信息
• GET /api/page/all：页面列表
• GET /api/page/detail?slug=xxx：页面详情
• GET /api/article/list：文章列表
• GET /api/product/list：产品列表
• GET /api/case/list：案例列表
• GET /api/subscription/status：订阅状态
• GET /api/sitemap.xml：动态站点地图
• GET /api/robots.txt：robots 文件
• POST /api/form/submit：表单提交

部署

npm run build
npm run preview

生产环境建议使用 Nginx 反向代理，配置泛域名 *.shoplnk.cn 指向 Nuxt 服务。

注意事项

• 模板组件为动态导入，新增模板后需在 app/templates/index.ts 注册
• 域名绑定查询接口 /cms/cms-website/resolveDomain 需 SaaS 后端实现
• 订阅状态接口 /api/app/subscription/check 需 SaaS 后端实现