MenthaMC 官方网站

基于 Vue 3 + TypeScript + Vite 构建的现代化 Minecraft 服务端项目官网

🌐 在线预览 | 📖 文档 | 💬 社区

✨ 项目特色

• 🚀 现代化技术栈 - Vue 3 + TypeScript + Vite
• 🌍 多语言支持 - 支持中文和英文，自动检测浏览器语言
• 📱 响应式设计 - 完美适配桌面端、平板和移动设备
• 🎨 精美 UI - 现代化的设计风格和流畅的动画效果
• ⚡ 高性能 - 基于 Vite 的快速构建和热重载
• 🔧 TypeScript - 完整的类型支持，提升开发体验

🌍 多语言支持

本网站完全支持多语言功能：

支持的语言

• 🇨🇳 简体中文 (zh-CN) - 默认语言
• 🇺🇸 English (en-US) - 英文支持

多语言特性

• ✅ 自动检测浏览器语言偏好
• ✅ 实时语言切换，无需刷新页面
• ✅ 语言偏好本地存储
• ✅ 响应式语言选择器
• ✅ 完整的页面翻译覆盖

🚀 快速开始

环境要求

• Node.js >= 16.0.0
• npm >= 7.0.0 或 yarn >= 1.22.0

安装依赖

# 使用 npm
npm install

# 或使用 yarn
yarn install

# 或使用 pnpm
pnpm install

开发环境

# 启动开发服务器
npm run dev

# 或
yarn dev

访问 http://localhost:5173 查看网站

构建生产版本

# 构建生产版本
npm run build

# 预览构建结果
npm run preview

类型检查

# 运行 TypeScript 类型检查
npm run type-check

🛠️ 技术栈

核心技术

• Vue 3 - 渐进式 JavaScript 框架
• TypeScript - JavaScript 的超集，提供静态类型检查
• Vite - 下一代前端构建工具
• Vue Router - Vue.js 官方路由管理器
• Vue I18n - Vue.js 国际化插件

开发工具

• ESLint - 代码质量检查
• Prettier - 代码格式化
• Husky - Git hooks 管理
• lint-staged - 暂存文件检查

🌐 部署

GitHub Pages

项目配置了 GitHub Actions 自动部署到 GitHub Pages：

1. 推送代码到 main 分支
2. GitHub Actions 自动构建
3. 部署到 gh-pages 分支
4. 通过 GitHub Pages 访问

其他部署方式

• Vercel - 零配置部署
• Netlify - 持续部署
• 服务器部署 - 构建后上传到服务器

🤝 贡献指南

我们欢迎所有形式的贡献！

如何贡献

1. Fork 本仓库
2. 创建特性分支 (git checkout -b feature/AmazingFeature)
3. 提交更改 (git commit -m 'Add some AmazingFeature')
4. 推送到分支 (git push origin feature/AmazingFeature)
5. 创建 Pull Request

开发规范

• 遵循 ESLint 和 Prettier 配置
• 提交信息使用约定式提交格式
• 添加适当的类型注解
• 编写清晰的代码注释

📝 多语言贡献

如果你想为网站添加新的语言支持：

1. 在 src/locales/ 目录下创建新的语言文件
2. 参考现有的 zh-CN.ts 和 en-US.ts 文件结构
3. 在 src/locales/index.ts 中添加新语言配置
4. 更新 availableLanguages 数组
5. 测试所有页面的翻译效果

详细信息请参考 多语言支持文档

📞 联系我们

• GitHub: MenthaMC
• Discord: 加入我们的社区
• 文档: 查看完整文档

📄 许可证

本项目采用 MIT 许可证 - 查看 LICENSE 文件了解详情

🙏 致谢

感谢所有为 MenthaMC 项目做出贡献的开发者和社区成员！

---

⬆ 回到顶部

Made with ❤️ by MenthaMC Team