NuxtVue企业官网

mms-pc — Nuxt 企业官网模板

作者 MrShanDev

mms-pc 是基于 Nuxt 3 的 PC 门户/官网模板，内置 6 套站点模板、i18n 多语言与 classic/modern 两套主题，通过 api/config.ts 对接 MMS 后端接口。

打开源站下载源码 ZIP

看看你的网站会是什么样

浏览真实页面截图，比较内容排版与手机效果。点击下方缩略图切换，放大查看整页细节。

2 个预览视图
桌面端首页1 / 2
桌面端截图首屏预览

由服务器浏览器实际访问页面后截取。

全部页面与视图 2

截图用于了解视觉与布局，交互效果请以实际项目为准。

采集于 2026-10-05查看来源

值得关注的模板亮点

从已有项目资料中，快速了解它的特点。

01

基于 Nuxt 3 与 Vue 3，使用服务端渲染，面向 SEO 场景

02

内置 6 套站点模板（pages/template01~06），可按需选用

03

支持 i18n 多语言，语言资源集中在 i18n/ 目录

04

提供 classic 与 modern 两套主题（themes/）

05

包含示例 API 层，接口地址集中在 api/config.ts，可对接 mms/mms-admin 等开放接口

06

使用 TypeScript，状态管理采用 Pinia，路由使用 Vue Router

模板详细介绍

mms-pc 是 MMS（Modular Management System）的 PC 端网页/门户，基于 Nuxt 3 与服务端渲染开发，面向门户与官网场景。仓库内置 6 套站点模板，分别位于 pages/template01 至 pages/template06；多语言资源放在 i18n/ 目录，主题分为 classic 与 modern 两套，位于 themes/。项目还包含示例 API 层（api/），后端对接 mms/mms-admin 等开放接口，接口地址集中在 api/config.ts。

技术栈方面，项目使用 Nuxt 3、Vue 3 与 TypeScript，状态管理采用 Pinia，路由使用 Vue Router，多语言依赖 @nuxtjs/i18n。运行环境要求 Node.js 18 及以上。

使用限制与配置要点：部署前需修改 api/config.ts 顶部的地址常量，区分本地（LOCAL_APP_URL）、开发（DEV_APP_URL）与生产（PROD_APP_URL，含 /prod-api 路径、PROD_WS_URL WebSocket）；构建命令为 npm run build（nuxt generate），产物位于 .output/public，需将目录内容上传服务器并配置 API 代理规则。代码采用 MIT 许可，但演示图片、字体、图标等第三方素材需按各自许可核对，域名、托管、数据库等外部服务可能另行收费。

NuxtVue企业官网

适合你的项目吗？

适用场景

  • 搭建企业门户或官网的 PC 端页面
  • 需要多语言支持的站点，通过 i18n/ 配置语言资源
  • 需要在 classic 与 modern 两套主题间切换或二次开发
  • 对接 MMS 后端开放接口，使用 api/config.ts 集中管理接口地址
  • 以静态站点方式生成并部署到服务器（.output/public）

适合人群

  • 需要 Nuxt 3 + Vue 3 技术栈的企业官网或门户项目
  • 希望基于现成多套模板快速起步并二次开发的团队
  • 需要服务端渲染以改善 SEO 的站点
  • 需要多语言与多主题能力的门户场景

上手与定制指南

结合仓库当前版本的说明，按下面的资料检查内容、配置与运行要求。

  1. 1

    环境要求 Node.js 18+，先执行 npm install

  2. 2

    本地开发可用 npm run local、npm run dev 或 npm run prod，分别对应不同环境变量

  3. 3

    部署前修改 api/config.ts 顶部的 LOCAL_APP_URL、DEV_APP_URL、PROD_APP_URL（含 /prod-api 路径）与 PROD_WS_URL

  4. 4

    构建使用 npm run build（nuxt generate），产物在 .output/public，上传服务器后需配置 API 代理规则

  5. 5

    代码为 MIT 许可，但演示图片、字体、图标等第三方素材需按各自许可核对

查看仓库使用说明

授权与来源资料

使用条件与限制

免费使用 · 保留许可声明

本次收录的是公开仓库中采用 MIT 许可的免费版本；免费范围为该版本代码，不代表外部服务或第三方素材免费。

使用时需要遵守

  • 允许免费使用、修改、商用和分发该版本代码。
  • 分发代码副本或实质性部分时，保留原作者版权声明和完整 MIT 许可声明。
  • 代码按现状提供；担保与责任限制以原许可证及适用法律为准。

额外费用与待核对事项

  • 演示图片、字体、图标及其他第三方素材需按各自许可核对，不能仅凭代码的 MIT 许可判断。
  • 域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
  • 该模板需对接 mms/mms-admin 等后端开放接口，接口地址集中在 api/config.ts，属于外部服务依赖，需自行准备或部署对应后端。
  • 部署前必须修改 api/config.ts 顶部的地址常量，配置本地/开发/生产环境对应的 API 地址后才能正常使用。
  • 生产环境需配置 PROD_APP_URL（含 /prod-api 路径）与 PROD_WS_URL（WebSocket）地址，依赖外部后端与 WebSocket 服务。
  • 部署时需自行配置 API 接口的代理规则，否则前端无法正常访问后端接口。
查看原文依据

Permission is hereby granted, free of charge

许可证原文

后端对接：`mms/mms-admin` 等开放接口，API 地址集中在 `api/config.ts`

README 原文

在部署前，修改 `api/config.ts` 顶部的地址常量即可：

README 原文

- **生产**：`PROD_APP_URL`（含 /prod-api 路径）、`PROD_WS_URL`（WebSocket）

README 原文

4. 配置 API 接口的代理规则

README 原文
https://github.com/MrShanDev/mms-pc/blob/master/LICENSEhttps://github.com/MrShanDev/mms-pc/blob/master/README.md

DeepSeek 根据仓库许可证和 README 整理 ·2026-10-05。结果仅覆盖已读取资料，依赖、图片、字体及后续条款变更以各自原文为准。

项目核对记录与介绍依据

模板资料

来源平台
GitHub
资料与维护参考分
资料较完整 · 85 / 100
技术栈
Nuxt · Vue
网站类型
企业官网
这个分数如何计算

本站按许可资料（最高30分）、演示链接（12分）、预览图（10分）、Star数（15分）、记录的维护时间（15分）、描述完整度（8分）、功能记录（5分）和分类资料（5分）计算。它不是代码、安全或性能测试，也不是 Google 评分；有链接不代表已实测可用。

这个项目需要核对什么

记录的仓库更新时间
2026-10-05
截图检查日期
2026-10-05

已收录演示链接。请用你的内容与屏幕尺寸检查；有演示不代表表单、认证或支付已经可用。

目录记录的主要技术栈是 Nuxt。请通过依赖清单和锁文件核对实际版本与托管要求。这些说明基于收录资料，不代表代码审计或部署实测。

查看具体选型方法 →

介绍的制作与核对状态

介绍由 AI 辅助整理目录与仓库资料。仓库作者不等于这篇介绍的审核者。

审核声明: [email protected] · 2026-10-05

查看当时使用的来源资料

SHA-256: a154f519467f23f0a92ddef4724de41132213226893042747471e9267cb75a2e

2026-10-05T07:12:29.813Z

来源文件 / 仓库
<div align="center">
   <br/>
   <a href="https://mmsadmin.cn">
     <img width="150" src="https://mmsadmin.cn/logo.png" alt="MMS logo">
   </a>
   <h1>模块化管理系统</h1>
   <p>MMS · Modular Management System</p>
   <p><strong>mms-pc · PC 门户 / 官网（Nuxt 3）</strong></p>
   <p><a href="https://mmsadmin.cn/">📘 在线文档 · mmsadmin.cn</a> · <a href="https://gitee.com/LumeCode/mms-pc">Gitee</a> · <a href="https://github.com/MrShanDev/mms-pc">GitHub</a></p>
   <br/>
</div>

[English](README.en.md) | 简体中文

`mms-pc` 是 **MMS 的 PC 端网页 / 门户**，基于 **Nuxt 3** 开发，服务端渲染带来良好的 **SEO** 表现。内置 **6 套站点模板**（`pages/template01~06`）、**i18n 多语言**（`i18n/`）、**多主题**（`themes/`：classic / modern）与示例 API 层（`api/`），面向门户与官网场景。

- 仓库：<https://gitee.com/LumeCode/mms-pc>（公开）
- 后端对接：`mms/mms-admin` 等开放接口，API 地址集中在 `api/config.ts`

---

## 技术栈

- Nuxt 3 + Vue 3 + TypeScript
- Pinia / Vue Router
- `@nuxtjs/i18n` 多语言

## 环境要求

- Node.js 18+

---

## 快速开始

```bash
npm install

# 本地开发（按环境选择其一）
npm run local   # 本地环境
npm run dev     # 开发环境
npm run prod    # 生产配置联调
```

## 脚本说明

| 命令 | 说明 |
|------|------|
| `npm run local` / `dev` / `prod` | 以对应环境变量启动 `nuxt dev` |
| `npm run build` | 生产构建（`nuxt generate`），产物在 `.output/public` |
| `npm run generate` | 静态站点生成 |
| `npm run preview` | 本地预览构建结果 |

---

## 构建与部署

使用 `npm run build` 命令进行构建，生成的文件位于 `.output/public` 目录。

### 配置切换

在部署前，修改 `api/config.ts` 顶部的地址常量即可：

- **本地**：`LOCAL_APP_URL`
- **开发**：`DEV_APP_URL`
- **生产**：`PROD_APP_URL`（含 /prod-api 路径）、`PROD_WS_URL`（WebSocket）

### 部署步骤

1. 修改 `api/config.ts` 中的 API 配置
2. 运行 `npm run build`
3. 将 `.output/public` 目录内容上传到服务器
4. 配置 API 接口的代理规则

---

## License

MIT；详见 [LICENSE](LICENSE) 文件。
反馈内容错误

看看同类模板

对比同技术栈与用途的模板，找到更适合的视觉与内容结构。

landing

landing

Nuxt Landing Template made with Nuxt UI and Nuxt Content.

Nuxt · 企业官网

tailwind-landing-page-nuxt

tailwind-landing-page-nuxt

Nuxt Version of the Tailwind Template Landing Page

Nuxt · 企业官网

agence-x-unocss

agence-x-unocss

AgenceX 是一个面向数字营销机构的企业官网落地页模板，技术栈为 Nuxt 与 UnoCSS，并借助 Unify UI Blocks 组织页面区块。 项目结构简单直接，主要面向需要快速呈现品牌形象与核心服务的团队。

Nuxt · 企业官网

landing-template

landing-template

Firelayer Template - Landing (Nuxt.js Website)

Nuxt · 企业官网

nuxt-starter

nuxt-starter

Nuxt Starter is a minimal template created for quick landing pages, built with Nuxt and Tailwind CSS.

Nuxt · 企业官网

nuxt-starter-template

nuxt-starter-template

Template for basic static site generated marketing website

Nuxt · 企业官网