Skip to content

Latest commit

 

History

History
68 lines (51 loc) · 2.44 KB

README_CH.md

File metadata and controls

68 lines (51 loc) · 2.44 KB
Raw

IFU Web 2.0

框架

  • Nuxt.js, 一个基于 Vue.js 的支持服务器渲染的框架

目录结构

  • assets: 所有图片资源，按照页面分了文件夹
  • components：所有 Vue 组件文件
  • lang：语言文件
  • layouts：default.vue 是所有页面的模板文件
  • pages：页面文件，每个文件会自动生成对应文件名的路由
  • plugins: 加载的 JS 插件，现在只有一个全局聊天框插件
  • static：除图片资源外的静态文件，现在只有网站图标
  • tabs：一些子页面，用来搭配 components/Tab.vue 这个组件实现 Tab 页面切换

页面结构

现在在 Figma 的设计稿里可以看到的版本有以下页面

  • 主页 /
  • 关于我们 /about
    • 故事
    • 文化
    • 历程
    • 团队
  • 服务
    • 多多罗 /totoro
      • 美本衔接课
      • 学术同步辅导课
    • IFU 会员 /membership
      • 普通会员
      • ISIC 会员
    • 更多服务 /more
  • 联系我们 /contact
    • 紧急联系
    • 其他
  • 支持我们 /support

开发

第一次将仓库 clone 到本地后，切换到 dev 分支

npm install 安装所有 NPM 包

npm run dev 会在 localhost:3000 启动 Nuxt.js 的测试服务器，所有文件更改会热更新

开发工具

建议使用 VS Code，项目配置了一些插件

  • Vetur: VS Code 支持 Vue 的插件
  • ESLint: 静态检查
  • Prettier: 自动 Format, 使用根目录下的 ifu-2.code-workspace 文件打开时，项目会自动开启 Format on Save, 保存时会自动调用 Prettier 格式化文件
  • i18n Ally: 可以集中查看翻译情况

用到的 NPM 包

部署