如何将我的降价内容正确映射到 Next.js 中的动态 URL?
How to properly map my markdown content to dynamic URLs in Next.js?
我想要以下 URL 结构:
URL
Role
/
markdown contents of /index.md
/about
markdown contents of /about.md
/cookies
markdown contents of /cookies.md
/privacy-policy
markdown contents of /privacy-policy.md
/category1
category1 index page
/category1/post1
markdown contents of /category1/post1.md
/category1/post2
markdown contents of /category1/post2.md
/category2
category2 index page
/category2/post1
markdown contents of /category2/post1.md
/category2/post2
markdown contents of /category2/post2.md
我想避免在根目录中为我的内容创建单独的 .js
文件(所以没有 /about.js
、/cookies.js
等),但如果我尝试像这样...
pages/
index.js
[root_article_id].js
[category]/
index.js
[category_article_id].js
... 然后 Next.js 抱怨,因为它无法决定我何时请求 URL /about
是否应该使用 [category]/index.js
或 [root_article_id].js
,尽管我觉得应该先调用后者,如果它不想处理请求(即如果我的 markdown 目录的根目录中没有 about.md
),那么它应该回退到 [category]/index.js
,如果 [category].js
吐出来,它仍然可以将请求传递给 404 处理程序。
为此构建 Next.js 文件的正确方法是什么?我真的需要在根内容目录中为我的降价文件设置单独的 .js
文件吗?
What's the correct way of structuring Next.js files for this? Do I really need to have separate .js files for my markdown files in the root content directory?
这是最简单的方法,因为您必须以某种方式告诉 nextjs 您希望哪些页面成为文章。但是,如果想避免这样做,可以使用 rewrites.
如果您知道所有文章(或类别),这就是您 next.config.js
:
中所需要的
module.exports = {
rewrites() {
return [
{
source: "/about",
destination: "/article/about",
},
{
source: "/cookies",
destination: "/article/cookies",
},
{
source: "/privacy-policy",
destination: "/article/privacy-policy",
},
];
},
};
然后制作article/[root_article_id]
页。请注意,重写并不意味着重定向。该页面将在 /about
中可用,但 nextjs 将像对 /article/about
的请求一样处理它。这意味着这些页面也可以从 article/about
获得,但如果出于某些必要原因,这可能会被阻止。
是否应该重写文章或类别取决于哪一个是动态的。如果从您知道所有可能值的意义上说,两者都不是真正动态的,则您应该选择可能值较少的那个。
如果类别和文章都是动态的,则需要使用middleware (beta)进行重写。在您的中间件中,您获得了请求,并且您需要以某种方式确定所请求的 url 是文章还是类别页面。如何做到这一点显然取决于您存储数据的位置和方式。
我想要以下 URL 结构:
URL | Role |
---|---|
/ | markdown contents of /index.md |
/about | markdown contents of /about.md |
/cookies | markdown contents of /cookies.md |
/privacy-policy | markdown contents of /privacy-policy.md |
/category1 | category1 index page |
/category1/post1 | markdown contents of /category1/post1.md |
/category1/post2 | markdown contents of /category1/post2.md |
/category2 | category2 index page |
/category2/post1 | markdown contents of /category2/post1.md |
/category2/post2 | markdown contents of /category2/post2.md |
我想避免在根目录中为我的内容创建单独的 .js
文件(所以没有 /about.js
、/cookies.js
等),但如果我尝试像这样...
pages/
index.js
[root_article_id].js
[category]/
index.js
[category_article_id].js
... 然后 Next.js 抱怨,因为它无法决定我何时请求 URL /about
是否应该使用 [category]/index.js
或 [root_article_id].js
,尽管我觉得应该先调用后者,如果它不想处理请求(即如果我的 markdown 目录的根目录中没有 about.md
),那么它应该回退到 [category]/index.js
,如果 [category].js
吐出来,它仍然可以将请求传递给 404 处理程序。
为此构建 Next.js 文件的正确方法是什么?我真的需要在根内容目录中为我的降价文件设置单独的 .js
文件吗?
What's the correct way of structuring Next.js files for this? Do I really need to have separate .js files for my markdown files in the root content directory?
这是最简单的方法,因为您必须以某种方式告诉 nextjs 您希望哪些页面成为文章。但是,如果想避免这样做,可以使用 rewrites.
如果您知道所有文章(或类别),这就是您 next.config.js
:
module.exports = {
rewrites() {
return [
{
source: "/about",
destination: "/article/about",
},
{
source: "/cookies",
destination: "/article/cookies",
},
{
source: "/privacy-policy",
destination: "/article/privacy-policy",
},
];
},
};
然后制作article/[root_article_id]
页。请注意,重写并不意味着重定向。该页面将在 /about
中可用,但 nextjs 将像对 /article/about
的请求一样处理它。这意味着这些页面也可以从 article/about
获得,但如果出于某些必要原因,这可能会被阻止。
是否应该重写文章或类别取决于哪一个是动态的。如果从您知道所有可能值的意义上说,两者都不是真正动态的,则您应该选择可能值较少的那个。
如果类别和文章都是动态的,则需要使用middleware (beta)进行重写。在您的中间件中,您获得了请求,并且您需要以某种方式确定所请求的 url 是文章还是类别页面。如何做到这一点显然取决于您存储数据的位置和方式。