Skip to content

Commit 6f30287

Browse files
ijjkijjk
committed
Add example pages for i18n routing
1 parent 31cc439 commit 6f30287

File tree

6 files changed

+182
-3
lines changed

6 files changed

+182
-3
lines changed

‎examples/i18n-routing/next.config.js

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
module.exports = {
2+
experimental: {
3+
i18n: {
4+
locales: ['en', 'fr', 'nl'],
5+
defaultLocale: 'en',
6+
},
7+
},
8+
}

‎examples/i18n-routing/pages/gsp/[slug].js

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
import Link from 'next/link'
2+
import { useRouter } from 'next/router'
3+
4+
export default function GspPage(props) {
5+
const router = useRouter()
6+
const { defaultLocale, isFallback, query } = router
7+
8+
if (isFallback) {
9+
return 'Loading...'
10+
}
11+
12+
return (
13+
<div>
14+
<h1>getServerSideProps page</h1>
15+
<p>Current slug: {query.slug}</p>
16+
<p>Current locale: {props.locale}</p>
17+
<p>Default locale: {defaultLocale}</p>
18+
<p>Configured locales: {JSON.stringify(props.locales)}</p>
19+
20+
<Link href="/gsp">
21+
<a>To getStaticProps page</a>
22+
</Link>
23+
<br />
24+
25+
<Link href="/gssp">
26+
<a>To getServerSideProps page</a>
27+
</Link>
28+
<br />
29+
30+
<Link href="/">
31+
<a>To index page</a>
32+
</Link>
33+
<br />
34+
</div>
35+
)
36+
}
37+
38+
export const getStaticProps = ({ locale, locales }) => {
39+
return {
40+
props: {
41+
locale,
42+
locales,
43+
},
44+
}
45+
}
46+
47+
export const getStaticPaths = ({ locales }) => {
48+
const paths = []
49+
50+
for (const locale of locales) {
51+
paths.push({ params: { slug: 'first' }, locale })
52+
paths.push({ params: { slug: 'second' }, locale })
53+
}
54+
55+
return {
56+
paths,
57+
fallback: true,
58+
}
59+
}

‎examples/i18n-routing/pages/gsp/index.js

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
import Link from 'next/link'
2+
import { useRouter } from 'next/router'
3+
4+
export default function GspPage(props) {
5+
const router = useRouter()
6+
const { defaultLocale } = router
7+
8+
return (
9+
<div>
10+
<h1>getServerSideProps page</h1>
11+
<p>Current locale: {props.locale}</p>
12+
<p>Default locale: {defaultLocale}</p>
13+
<p>Configured locales: {JSON.stringify(props.locales)}</p>
14+
15+
<Link href="/gsp/first">
16+
<a>To dynamic getStaticProps page</a>
17+
</Link>
18+
<br />
19+
20+
<Link href="/gssp">
21+
<a>To getServerSideProps page</a>
22+
</Link>
23+
<br />
24+
25+
<Link href="/">
26+
<a>To index page</a>
27+
</Link>
28+
<br />
29+
</div>
30+
)
31+
}
32+
33+
export const getStaticProps = ({ locale, locales }) => {
34+
return {
35+
props: {
36+
locale,
37+
locales,
38+
},
39+
}
40+
}

‎examples/i18n-routing/pages/gssp.js

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
import Link from 'next/link'
2+
import { useRouter } from 'next/router'
3+
4+
export default function GsspPage(props) {
5+
const router = useRouter()
6+
const { defaultLocale } = router
7+
8+
return (
9+
<div>
10+
<h1>getServerSideProps page</h1>
11+
<p>Current locale: {props.locale}</p>
12+
<p>Default locale: {defaultLocale}</p>
13+
<p>Configured locales: {JSON.stringify(props.locales)}</p>
14+
15+
<Link href="/gsp">
16+
<a>To getStaticProps page</a>
17+
</Link>
18+
<br />
19+
20+
<Link href="/gsp/first">
21+
<a>To dynamic getStaticProps page</a>
22+
</Link>
23+
<br />
24+
25+
<Link href="/">
26+
<a>To index page</a>
27+
</Link>
28+
<br />
29+
</div>
30+
)
31+
}
32+
33+
export const getServerSideProps = ({ locale, locales }) => {
34+
return {
35+
props: {
36+
locale,
37+
locales,
38+
},
39+
}
40+
}

‎examples/i18n-routing/pages/index.js

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
import Link from 'next/link'
2+
import { useRouter } from 'next/router'
3+
4+
export default function IndexPage(props) {
5+
const router = useRouter()
6+
const { locale, locales, defaultLocale } = router
7+
8+
return (
9+
<div>
10+
<h1>Index page</h1>
11+
<p>Current locale: {locale}</p>
12+
<p>Default locale: {defaultLocale}</p>
13+
<p>Configured locales: {JSON.stringify(locales)}</p>
14+
15+
<Link href="/gsp">
16+
<a>To getStaticProps page</a>
17+
</Link>
18+
<br />
19+
20+
<Link href="/gsp/first">
21+
<a>To dynamic getStaticProps page</a>
22+
</Link>
23+
<br />
24+
25+
<Link href="/gssp">
26+
<a>To getServerSideProps page</a>
27+
</Link>
28+
<br />
29+
</div>
30+
)
31+
}

‎yarn.lock

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -15826,9 +15826,10 @@ [email protected]:
1582615826
postcss "^7.0.2"
1582715827
postcss-load-plugins "^2.3.0"
1582815828

15829-
[email protected]:
15830-
version "3.3.0"
15831-
resolved "https://registry.yarnpkg.com/styled-jsx/-/styled-jsx-3.3.0.tgz#32335c1a3ecfc923ba4f9c056eeb3d4699006b09"
15829+
[email protected]:
15830+
version "3.3.1"
15831+
resolved "https://registry.yarnpkg.com/styled-jsx/-/styled-jsx-3.3.1.tgz#d79f306c42c99cefbe8e76f35dad8100dc5c9ecc"
15832+
integrity sha512-RhW71t3k95E3g7Zq3lEBk+kmf+p4ZME7c5tfsYf9M5mq6CgIvFXkbvhawL2gWriXLRlMyKAYACE89Qa2JnTqUw==
1583215833
dependencies:
1583315834
"@babel/types" "7.8.3"
1583415835
babel-plugin-syntax-jsx "6.18.0"

0 commit comments

Comments
 (0)