Merge branch 'canary' into eslint

vercel · Apr 29, 2021 · 2a81a5c · 2a81a5c
2 parents 51c8aa9 + f9faf3f
commit 2a81a5c
Show file tree

Hide file tree

Showing 43 changed files with 465 additions and 205 deletions.
diff --git a/docs/api-reference/next.config.js/headers.md b/docs/api-reference/next.config.js/headers.md
@@ -173,8 +173,6 @@ module.exports = {
 
 ## Header, Cookie, and Query Matching
 
-Note: this feature is still experimental and not covered by semver and is to be used at your own risk until it is made stable.
-
 To only apply a header when either header, cookie, or query values also match the `has` field can be used. Both the `source` and all `has` items must match for the header to be applied.
 
 `has` items have the following fields:

diff --git a/docs/api-reference/next.config.js/redirects.md b/docs/api-reference/next.config.js/redirects.md
@@ -117,8 +117,6 @@ module.exports = {
 
 ## Header, Cookie, and Query Matching
 
-Note: this feature is still experimental and not covered by semver and is to be used at your own risk until it is made stable.
-
 To only match a redirect when header, cookie, or query values also match the `has` field can be used. Both the `source` and all `has` items must match for the redirect to be applied.
 
 `has` items have the following fields:

diff --git a/docs/api-reference/next.config.js/rewrites.md b/docs/api-reference/next.config.js/rewrites.md
@@ -197,8 +197,6 @@ module.exports = {
 
 ## Header, Cookie, and Query Matching
 
-Note: this feature is still experimental and not covered by semver and is to be used at your own risk until it is made stable.
-
 To only match a rewrite when header, cookie, or query values also match the `has` field can be used. Both the `source` and all `has` items must match for the rewrite to be applied.
 
 `has` items have the following fields:

diff --git a/docs/basic-features/font-optimization.md b/docs/basic-features/font-optimization.md
@@ -0,0 +1,88 @@
+---
+description: Next.js supports built-in web font optimization to inline font CSS. Learn more here.
+---
+
+# Font Optimization
+
+Since version **10.2**, Next.js has built-in web font optimization.
+
+By default, Next.js will automatically inline font CSS at build time, eliminating an extra round trip to fetch font declarations. This results in improvements to [First Contentful Paint (FCP)](https://web.dev/fcp/) and [Largest Contentful Paint (LCP)](https://vercel.com/blog/core-web-vitals#largest-contentful-paint). For example:
+
+```js
+// Before
+<link
+  href="https://fonts.googleapis.com/css2?family=Inter"
+  rel="stylesheet"
+/>
+
+// After
+<style data-href="https://fonts.googleapis.com/css2?family=Inter">
+  @font-face{font-family:'Inter';font-style:normal...
+</style>
+```
+
+## Usage
+
+To add a web font to your Next.js application, override `next/head`. For example, you can add a font to a specific page:
+
+```js
+// pages/index.js
+
+import Head from 'next/head'
+
+export default function IndexPage() {
+  return (
+    <div>
+      <Head>
+        <link
+          href="https://fonts.googleapis.com/css2?family=Inter"
+          rel="stylesheet"
+        />
+      </Head>
+      <p>Hello world!</p>
+    </div>
+  )
+}
+```
+
+or to your entire application with a [Custom `Document`](/docs/advanced-features/custom-document.md).
+
+```js
+// pages/_document.js
+
+import Document, { Html, Head, Main, NextScript } from 'next/document'
+
+class MyDocument extends Document {
+  render() {
+    return (
+      <Html>
+        <Head>
+          <link
+            href="https://fonts.googleapis.com/css2?family=Inter"
+            rel="stylesheet"
+          />
+        </Head>
+        <body>
+          <Main />
+          <NextScript />
+        </body>
+      </Html>
+    )
+  }
+}
+
+export default MyDocument
+```
+
+Automatic Webfont Optimization currently supports Google Fonts, with support for other font providers coming soon. We're also planning to add control over [loading strategies](https://github.com/vercel/next.js/issues/21555) and `font-display` values.
+
+## Related
+
+For more information on what to do next, we recommend the following sections:
+
+<div class="card">
+  <a href="/docs/advanced-features/custom-document.md">
+    <b>Custom Document</b>
+    <small>Learn how to augment your application's html and body tags.</small>
+  </a>
+</div>
diff --git a/docs/manifest.json b/docs/manifest.json
@@ -25,6 +25,10 @@
               "title": "Image Optimization",
               "path": "/docs/basic-features/image-optimization.md"
             },
+            {
+              "title": "Font Optimization",
+              "path": "/docs/basic-features/font-optimization.md"
+            },
             {
               "title": "Static File Serving",
               "path": "/docs/basic-features/static-file-serving.md"

diff --git a/examples/with-mongodb-mongoose/utils/dbConnect.js b/examples/with-mongodb-mongoose/utils/dbConnect.js
@@ -1,6 +1,6 @@
 import mongoose from 'mongoose'
 
-const { MONGODB_URI } = process.env
+const MONGODB_URI = process.env.MONGODB_URI
 
 if (!MONGODB_URI) {
   throw new Error(

diff --git a/examples/with-passport/package.json b/examples/with-passport/package.json
@@ -14,7 +14,7 @@
     "passport-local": "1.0.0",
     "react": "latest",
     "react-dom": "latest",
-    "swr": "0.3.0",
+    "swr": "^0.5.5",
     "uuid": "8.3.1"
   },
   "license": "MIT"

diff --git a/examples/with-styled-components-rtl/package.json b/examples/with-styled-components-rtl/package.json
@@ -8,13 +8,14 @@
   },
   "dependencies": {
     "next": "latest",
-    "react": "16.12.0",
-    "react-dom": "16.12.0",
-    "styled-components": "5.0.0",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
+    "react-is": "^17.0.2",
+    "styled-components": "^5.2.3",
     "stylis-plugin-rtl": "1.0.0"
   },
   "devDependencies": {
-    "babel-plugin-styled-components": "1.10.6"
+    "babel-plugin-styled-components": "^1.12.0"
   },
   "license": "MIT"
 }
diff --git a/examples/with-styled-components/package.json b/examples/with-styled-components/package.json
@@ -8,13 +8,13 @@
   },
   "dependencies": {
     "next": "latest",
-    "react": "^16.8.0",
-    "react-dom": "^16.8.0",
-    "react-is": "^16.8.0",
-    "styled-components": "^5.0.0"
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
+    "react-is": "^17.0.2",
+    "styled-components": "^5.2.3"
   },
   "devDependencies": {
-    "babel-plugin-styled-components": "^1.8.0"
+    "babel-plugin-styled-components": "^1.12.0"
   },
   "license": "MIT"
 }
diff --git a/examples/with-typescript-styled-components/package.json b/examples/with-typescript-styled-components/package.json
@@ -8,17 +8,18 @@
   },
   "dependencies": {
     "next": "latest",
-    "react": "^16.13.0",
-    "react-dom": "^16.13.0",
-    "styled-components": "^5.0.0"
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
+    "react-is": "^17.0.2",
+    "styled-components": "^5.2.3"
   },
   "devDependencies": {
-    "@types/node": "12.0.12",
-    "@types/react": "16.8.23",
-    "@types/react-dom": "16.8.4",
-    "@types/styled-components": "5.0.1",
-    "babel-plugin-styled-components": "^1.10.0",
-    "typescript": "4.0"
+    "@types/node": "15.0.0",
+    "@types/react": "17.0.4",
+    "@types/react-dom": "17.0.3",
+    "@types/styled-components": "5.1.9",
+    "babel-plugin-styled-components": "^1.12.0",
+    "typescript": "4.2.4"
   },
   "license": "MIT"
 }
diff --git a/lerna.json b/lerna.json
@@ -17,5 +17,5 @@
       "registry": "https://registry.npmjs.org/"
     }
   },
-  "version": "10.1.4-canary.16"
+  "version": "10.2.1-canary.0"
 }
diff --git a/packages/create-next-app/package.json b/packages/create-next-app/package.json
@@ -1,6 +1,6 @@
 {
   "name": "create-next-app",
-  "version": "10.1.4-canary.16",
+  "version": "10.2.1-canary.0",
   "keywords": [
     "react",
     "next",

diff --git a/packages/eslint-plugin-next/package.json b/packages/eslint-plugin-next/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/eslint-plugin-next",
-  "version": "10.1.4-canary.16",
+  "version": "10.2.1-canary.0",
   "description": "ESLint plugin for NextJS.",
   "main": "lib/index.js",
   "license": "MIT",

diff --git a/packages/next-bundle-analyzer/package.json b/packages/next-bundle-analyzer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/bundle-analyzer",
-  "version": "10.1.4-canary.16",
+  "version": "10.2.1-canary.0",
   "main": "index.js",
   "license": "MIT",
   "repository": {

diff --git a/packages/next-codemod/package.json b/packages/next-codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/codemod",
-  "version": "10.1.4-canary.16",
+  "version": "10.2.1-canary.0",
   "license": "MIT",
   "dependencies": {
     "chalk": "4.1.0",

diff --git a/packages/next-env/package.json b/packages/next-env/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/env",
-  "version": "10.1.4-canary.16",
+  "version": "10.2.1-canary.0",
   "keywords": [
     "react",
     "next",

diff --git a/packages/next-mdx/package.json b/packages/next-mdx/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/mdx",
-  "version": "10.1.4-canary.16",
+  "version": "10.2.1-canary.0",
   "main": "index.js",
   "license": "MIT",
   "repository": {

diff --git a/packages/next-plugin-storybook/package.json b/packages/next-plugin-storybook/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/plugin-storybook",
-  "version": "10.1.4-canary.16",
+  "version": "10.2.1-canary.0",
   "repository": {
     "url": "vercel/next.js",
     "directory": "packages/next-plugin-storybook"

diff --git a/packages/next-polyfill-module/package.json b/packages/next-polyfill-module/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/polyfill-module",
-  "version": "10.1.4-canary.16",
+  "version": "10.2.1-canary.0",
   "description": "A standard library polyfill for ES Modules supporting browsers (Edge 16+, Firefox 60+, Chrome 61+, Safari 10.1+)",
   "main": "dist/polyfill-module.js",
   "license": "MIT",

diff --git a/packages/next-polyfill-nomodule/package.json b/packages/next-polyfill-nomodule/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/polyfill-nomodule",
-  "version": "10.1.4-canary.16",
+  "version": "10.2.1-canary.0",
   "description": "A polyfill for non-dead, nomodule browsers.",
   "main": "dist/polyfill-nomodule.js",
   "license": "MIT",