目录结构

发展历程

随着不同的时间阶段，Node.js + 前端 结合的应用的目录结构组织也在不断的变化，这里大概分为三个阶段

前后端完全独立

前端和后端在不同的仓库中存在，完全独立部署，常见于前端 + Java的项目中，但是 Node 和前端技术栈一致，并且操作繁琐，所以这种模式在前端+Node模式中逐渐淘汰

前后端独立文件夹

这种模式是前端和后端在同一个仓库，但是使用不同的文件夹，格子独立的 package.json

前后端共享文件夹

很多团队在探索前后端一体化的相关实践。就提出了将前后端代码放在一个文件夹当中维护的想法。

这样的优势在于前端组件可以迅速服用服务端定义的 interface。但是虽然语法都是 ts|js 但是它们实际的运行环境是完全不同的，这样的做法对使用者的心智要求非常高。一旦双端互相访问了对方环境的变量，在打包的时候就是灾难。

但是这种思路是未来的发展趋势，我们后续也会考虑如何更好的组织目录结构以便于前后端能够共享环境无关的代码

目录结构

在 Tiger 目录结构 的基础上，我们添加了 web 目录，用来存放前端相关的内容

├── web                         // 前端源码目录
│   ├── components              // 组件目录
│   │   ├── Layout.tsx          // 默认的布局组件、必备
│   ├── pages                   // 默认的页面级别组件、框架根据目录结构创建路由
│   │   ├── app.tsx             // 用户组定义组件，该组件可以通过 /app 访问
│   │   ├── order              
│   │   │   ├── index.tsx       //  用户组定义组件，该组件可以通过 /order 访问
├── tiger.confg.ts              // 默认框架配置文件，可以扩展 webpack或者配置项目