创建 nextapp
pnpx create-next-app xxxx
路由
文件式生成路由
自动识别在src/app目录下
创建的page.tsx 文件
动态路由
src/
└── app/└── product/└── [productId]/└── page.tsx其中page中的函数 {params} 为固定识别的参数可以获取路由传过来的值
嵌套动态路由
src/
└── app/└── product/└── [productId]/└── reviews/└── [reviewsId]/└── page.tsx└── page.tsx
多层嵌套 可以获取所有层级动态路由的值
捕获所有路由（Catch-All 路由）
src/
└── app/└── products/└── [...slug].js
访问 /products/a、/products/a/b、/products/a/b/c 等路径都会匹配到 [...slug]，并且这些路径的具体参数可以通过 slug 变量在组件中获取：
私有路由
src/
└── app/└── _lib/└── page.tsx
不会将在以_或%5(_转义字符)起始的文件夹的文件识别为路由
页面不可见
404 页面
在根目录创建
not-found.tsx
单独为某页面设置 404
与文件夹page.tsx同级创建not-found.tsx
pages/
└── product/└── [productId]/└── reviews/└── [reviewsId]/└── page.tsx└── not-found.tsx└── page.tsx
