108 - 《极简的扁平结构约定式路由》

约定式路由即文件路由，是现在前端框架的标配，next.js、nuxt.js、remix、umi 等都有实现，规则大同小异。比如 pages 目录下包含 a.js 和 b.js，就会生成 /a 和 /b 的路由。

约定式路由的好处是不用再通过配置的方式定义路由，但也有缺点，其中较大的一个是不能在一个地方看到所有路由（这是配置式路由的优点）。大家可能会想到在 pages 目录下执行 tree 看目录树，能看个大概，但结果上会有不少无关的干扰，比如 css 文件和 components 文件等。

之前有看到 jamiebuilds 提议的扁平式约定式路由能解这个问题。jamiebuilds 是 react-loadable、unstated 等库的作者，还和 sebmck 一起搞了 babel 和 rome，曾经是 rome 的合伙人但后来退出了。

这个方案举个例子。比如，

users./Users.route.jsx
users.index/UsersIndex.route.jsx
users.$id.posts/UsersIdPosts.route.jsx

以上文件结构会被翻译成以下路由结构。

/users (users./Users.route.jsx)
  /users (users.index/UsersIndex.route.jsx)
  /users/:id/posts (users.$id.posts/UsersIdPosts.route.jsx)

一些特点，

1、一个目录下即可看全所有路由
2、用 *.route.* 作为唯