启用 React Router 的数据模式

启用后,可以实现页面懒加载,减少初始包大小。也可以在路由中间件里实现统一鉴权逻辑。

比如,我这个 blog 编辑页,采用了 CodeMirror 组件作为 markdown 编辑器,打包很大。这个页面就适合用懒加载,

{ path: 'blog/:id', lazy: BlogEditPage },

...

async function BlogEditPage() {
    const { BlogEditPage } = await import('./pages/BlogEditPage')
    return { Component: BlogEditPage }
}
发表于 2026 年 1 月 23 日,星期五
更新于 2026 年 5 月 4 日,星期一