Skip to content

Commit efcb47a

Browse files
ascorbicascorbic
authored
feat: support Next 13 (#1714)
* chore(deps): update demos and deps to Next 13 * chore: add swc * chore: switch old node tests to use node 14 * fix: correct requestdata type * chore: update next/link syntax * chore: use legacy image component for now
1 parent 530088c commit efcb47a

File tree

50 files changed

+812
-1432
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

50 files changed

+812
-1432
lines changed

‎.github/workflows/test.yml

+6-6
Original file line numberDiff line numberDiff line change
@@ -15,12 +15,12 @@ jobs:
1515
strategy:
1616
matrix:
1717
os: [ubuntu-latest, macOS-latest, windows-latest]
18-
node-version: [12, '*']
18+
node-version: [14, '*']
1919
exclude:
2020
- os: macOS-latest
21-
node-version: 12
21+
node-version: 14
2222
- os: windows-latest
23-
node-version: 12
23+
node-version: 14
2424
fail-fast: false
2525

2626
steps:
@@ -50,12 +50,12 @@ jobs:
5050
strategy:
5151
matrix:
5252
os: [ubuntu-latest, macOS-latest, windows-latest]
53-
node-version: [12, '*']
53+
node-version: [14, '*']
5454
exclude:
5555
- os: macOS-latest
56-
node-version: 12
56+
node-version: 14
5757
- os: windows-latest
58-
node-version: 12
58+
node-version: 14
5959
fail-fast: false
6060

6161
if: github.ref_name == 'main'

‎.vscode/feat-test.code-snippets

+1-1
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@
1616
"\treturn (",
1717
"\t\t<div>",
1818
"\t\t<h1>$1</h1>",
19-
"\t\t<Link href=\"\"><a>Read Docs</a></Link>",
19+
"\t\t<Link href=\"\">Read Docs</Link>",
2020
"\t\t<p>Description of feature</p>",
2121
"\t\t<p>Example/test of feature</p>",
2222
"\t\t</div>",

‎demos/base-path/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@
1313
"typescript": "^4.6.3"
1414
},
1515
"dependencies": {
16-
"next": "^12.3.0"
16+
"next": "^12.3.2-canary.43"
1717
},
1818
"scripts": {
1919
"test": "echo \"Error: no test specified\" && exit 1"

‎demos/custom-routes/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
"typescript": "^4.7.4"
1515
},
1616
"dependencies": {
17-
"next": "^12.3.0"
17+
"next": "^12.3.2-canary.43"
1818
},
1919
"scripts": {
2020
"build": "next build",

‎demos/default/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@
2121
"@reach/dialog": "^0.16.2",
2222
"@reach/visually-hidden": "^0.16.0",
2323
"@vercel/og": "^0.0.15",
24-
"next": "^12.3.0",
24+
"next": "^12.3.2-canary.43",
2525
"react": "^18.0.0",
2626
"react-dom": "^18.0.0"
2727
},

‎demos/default/pages/broken-image.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import Image from 'next/image'
1+
import Image from 'next/legacy/image'
22

33
// This should cause an error, because broken-domain is not part of the configured next.config.js image domains
44
const Images = () => (

‎demos/default/pages/css/index.tsx

+10-7
Original file line numberDiff line numberDiff line change
@@ -12,23 +12,27 @@ function BuiltInCSSSupport() {
1212
return (
1313
<div>
1414
<h1>Built In CSS Support</h1>
15-
<Link href="https://nextjs.org/docs/basic-features/built-in-css-support"><a>Read Docs</a></Link>
15+
<Link href="https://nextjs.org/docs/basic-features/built-in-css-support">Read Docs</Link>
1616

17-
1817
<h2>CSS Modules</h2>
1918
<p>CSS Modules are an optional feature and are only enabled for files with the .module.css extension. </p>
2019
<p className={styles.error}>This is made with an imported css module</p>
2120

22-
<h2>Import styles from <code>node_modules</code></h2>
21+
<h2>
22+
Import styles from <code>node_modules</code>
23+
</h2>
2324
<p>This page imports a node module&apos;s css file for the dialog below:</p>
24-
<ExampleDialog/>
25+
<ExampleDialog />
2526

2627
<h2>Sass Support</h2>
2728
<p>✅ Sass variable imported, color: {variables.primaryColor || <code>Error. Something went wrong</code>}</p>
2829

2930
<div data-testid="css-in-js">
3031
<h2>CSS-in-JS</h2>
31-
<p>NextJS bundles styled-jsx to provide support for isolated scoped CSS. The aim is to support &quot;shadow CSS&quot; similar to Web Components, which unfortunately do not support server-rendering and are JS-only.</p>
32+
<p>
33+
NextJS bundles styled-jsx to provide support for isolated scoped CSS. The aim is to support &quot;shadow
34+
CSS&quot; similar to Web Components, which unfortunately do not support server-rendering and are JS-only.
35+
</p>
3236
<style jsx>{`
3337
p {
3438
color: white;
@@ -46,7 +50,6 @@ function BuiltInCSSSupport() {
4650
}
4751
`}</style>
4852
</div>
49-
5053
</div>
5154
)
5255
}
@@ -70,4 +73,4 @@ function ExampleDialog() {
7073
</Dialog>
7174
</div>
7275
)
73-
}
76+
}

‎demos/default/pages/deep/import.js

+1-3
Original file line numberDiff line numberDiff line change
@@ -20,9 +20,7 @@ const Show = ({ show }) => (
2020

2121
<hr />
2222

23-
<Link href="/">
24-
<a>Go back home</a>
25-
</Link>
23+
<Link href="/">Go back home</Link>
2624
</div>
2725
)
2826

‎demos/default/pages/font.tsx

+9-8
Original file line numberDiff line numberDiff line change
@@ -5,19 +5,20 @@ function Font() {
55
return (
66
<div>
77
{/* <Head> */}
8-
<link
9-
href="https://fonts.googleapis.com/css2?family=Inter&display=optional"
10-
rel="stylesheet"
11-
/>
8+
<link href="https://fonts.googleapis.com/css2?family=Inter&display=optional" rel="stylesheet" />
129
{/* </Head> */}
1310
<h1>Font Optimization</h1>
14-
<Link href="https://nextjs.org/docs/basic-features/font-optimization"><a>Read Docs</a></Link>
11+
<Link href="https://nextjs.org/docs/basic-features/font-optimization">Read Docs</Link>
1512
<p>
16-
By default, Next.js will automatically inline font CSS at build time, eliminating an extra round trip to fetch font declarations.
13+
By default, Next.js will automatically inline font CSS at build time, eliminating an extra round trip to fetch
14+
font declarations.
15+
</p>
16+
<p>
17+
If optimized font is enabled (default), it should show <code>style</code>, otherwise it should show{' '}
18+
<code>link</code> in the head
1719
</p>
18-
<p>If optimized font is enabled (default), it should show <code>style</code>, otherwise it should show <code>link</code> in the head</p>
1920
</div>
2021
)
2122
}
2223

23-
export default Font
24+
export default Font

‎demos/default/pages/getServerSideProps/[id].js

+1-3
Original file line numberDiff line numberDiff line change
@@ -25,9 +25,7 @@ const Show = ({ errorCode, show, env }) => {
2525

2626
<hr />
2727

28-
<Link href="/">
29-
<a>Go back home</a>
30-
</Link>
28+
<Link href="/">Go back home</Link>
3129
</div>
3230
)
3331
}

‎demos/default/pages/getServerSideProps/all/[[...slug]].js

+1-3
Original file line numberDiff line numberDiff line change
@@ -25,9 +25,7 @@ const Show = ({ errorCode, show }) => {
2525

2626
<hr />
2727

28-
<Link href="/">
29-
<a>Go back home</a>
30-
</Link>
28+
<Link href="/">Go back home</Link>
3129
</div>
3230
)
3331
}

‎demos/default/pages/getServerSideProps/static.js

+1-3
Original file line numberDiff line numberDiff line change
@@ -17,9 +17,7 @@ const Show = ({ show }) => (
1717

1818
<hr />
1919

20-
<Link href="/">
21-
<a>Go back home</a>
22-
</Link>
20+
<Link href="/">Go back home</Link>
2321
</div>
2422
)
2523

‎demos/default/pages/getStaticProps/[id].js

+1-3
Original file line numberDiff line numberDiff line change
@@ -11,9 +11,7 @@ const Show = ({ show, time }) => (
1111
<p>Rendered at {time} (slowly)</p>
1212
<hr />
1313

14-
<Link href="/">
15-
<a>Go back home</a>
16-
</Link>
14+
<Link href="/">Go back home</Link>
1715
</div>
1816
)
1917

‎demos/default/pages/getStaticProps/env.js

+1-3
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,7 @@ const Env = ({ env }) => (
77
<hr />
88
<p>env: {env}</p>
99

10-
<Link href="/">
11-
<a>Go back home</a>
12-
</Link>
10+
<Link href="/">Go back home</Link>
1311
</div>
1412
)
1513

‎demos/default/pages/getStaticProps/static.js

+1-3
Original file line numberDiff line numberDiff line change
@@ -11,9 +11,7 @@ const Show = ({ show }) => (
1111

1212
<hr />
1313

14-
<Link href="/">
15-
<a>Go back home</a>
16-
</Link>
14+
<Link href="/">Go back home</Link>
1715
</div>
1816
)
1917

‎demos/default/pages/getStaticProps/with-revalidate-404.js

+1-3
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,7 @@ const Show = () => (
44
<div>
55
<p>This page is ISR, but will return a 404 if the current time ends in 0-4.</p>
66

7-
<Link href="/">
8-
<a>Go back home</a>
9-
</Link>
7+
<Link href="/">Go back home</Link>
108
</div>
119
)
1210

‎demos/default/pages/getStaticProps/with-revalidate.js

+1-3
Original file line numberDiff line numberDiff line change
@@ -11,9 +11,7 @@ const Show = ({ show }) => (
1111

1212
<hr />
1313

14-
<Link href="/">
15-
<a>Go back home</a>
16-
</Link>
14+
<Link href="/">Go back home</Link>
1715
</div>
1816
)
1917

‎demos/default/pages/getStaticProps/withFallback/[...slug].js

+1-3
Original file line numberDiff line numberDiff line change
@@ -23,9 +23,7 @@ const Show = ({ show, time }) => {
2323
<p>Rendered at {time} </p>
2424
<hr />
2525

26-
<Link href="/">
27-
<a>Go back home</a>
28-
</Link>
26+
<Link href="/">Go back home</Link>
2927
</div>
3028
)
3129
}

‎demos/default/pages/getStaticProps/withFallback/[id].js

+1-3
Original file line numberDiff line numberDiff line change
@@ -23,9 +23,7 @@ const Show = ({ show, time }) => {
2323
<p>Rendered at {time} </p>
2424
<hr />
2525

26-
<Link href="/">
27-
<a>Go back home</a>
28-
</Link>
26+
<Link href="/">Go back home</Link>
2927
</div>
3028
)
3129
}

‎demos/default/pages/getStaticProps/withFallbackBlocking/[id].js

+1-3
Original file line numberDiff line numberDiff line change
@@ -12,9 +12,7 @@ const Show = ({ show, time }) => (
1212
<p>Rendered at {time} </p>
1313
<hr />
1414

15-
<Link href="/">
16-
<a>Go back home</a>
17-
</Link>
15+
<Link href="/">Go back home</Link>
1816
</div>
1917
)
2018

‎demos/default/pages/getStaticProps/withRevalidate/[id].js

+1-3
Original file line numberDiff line numberDiff line change
@@ -12,9 +12,7 @@ const Show = ({ show, time }) => (
1212
<p>Rendered at {time} (slowly)</p>
1313
<hr />
1414

15-
<Link href="/">
16-
<a>Go back home</a>
17-
</Link>
15+
<Link href="/">Go back home</Link>
1816
</div>
1917
)
2018

‎demos/default/pages/getStaticProps/withRevalidate/withFallback/[id].js

+1-3
Original file line numberDiff line numberDiff line change
@@ -24,9 +24,7 @@ const Show = ({ show, time }) => {
2424
<p>Rendered at {time} </p>
2525
<hr />
2626

27-
<Link href="/">
28-
<a>Go back home</a>
29-
</Link>
27+
<Link href="/">Go back home</Link>
3028
</div>
3129
)
3230
}

‎demos/default/pages/getStaticProps/withRevalidate/withFallbackBlocking/[id].js

+1-3
Original file line numberDiff line numberDiff line change
@@ -12,9 +12,7 @@ const Show = ({ show, time }) => (
1212
<p>Rendered at {time} </p>
1313
<hr />
1414

15-
<Link href="/">
16-
<a>Go back home</a>
17-
</Link>
15+
<Link href="/">Go back home</Link>
1816
</div>
1917
)
2018

‎demos/default/pages/image.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import Image from 'next/image'
1+
import Image from 'next/legacy/image'
22
import img from './unsplash.jpg'
33
import logo from './logomark.svg'
44

0 commit comments

Comments
 (0)