Merge branch 'canary' into perf/static-check-avoid-main

vercel · May 17, 2021 · 4b6b9cd · 4b6b9cd
2 parents f4f514d + a442053
commit 4b6b9cd
Show file tree

Hide file tree

Showing 71 changed files with 1,256 additions and 419 deletions.
diff --git a/data.sqlite b/data.sqlite
diff --git a/docs/api-reference/create-next-app.md b/docs/api-reference/create-next-app.md
@@ -18,7 +18,7 @@ yarn create next-app
 
 - **-e, --example [name]|[github-url]** - An example to bootstrap the app with. You can use an example name from the [Next.js repo](https://github.com/vercel/next.js/tree/master/examples) or a GitHub URL. The URL can use any branch and/or subdirectory.
 - **--example-path [path-to-example]** - In a rare case, your GitHub URL might contain a branch name with a slash (e.g. bug/fix-1) and the path to the example (e.g. foo/bar). In this case, you must specify the path to the example separately: `--example-path foo/bar`
-- **--use-npm** - Explicitly tell the CLI to bootstrap the app using npm. Yarn will be used by default if it's installed
+- **--use-npm** - Explicitly tell the CLI to bootstrap the app using npm. To bootstrap using yarn we recommend to run `yarn create next-app`
 
 ### Why use Create Next App?
 

diff --git a/docs/api-reference/next.config.js/rewrites.md b/docs/api-reference/next.config.js/rewrites.md
@@ -25,8 +25,6 @@ Rewrites allow you to map an incoming request path to a different destination pa
 
 Rewrites act as a URL proxy and mask the destination path, making it appear the user hasn't changed their location on the site. In contrast, [redirects](/docs/api-reference/next.config.js/redirects.md) will reroute to a new page a show the URL changes.
 
-Rewrites are only available on the Node.js environment and do not affect client-side routing.
-
 To use rewrites you can use the `rewrites` key in `next.config.js`:
 
 ```js
@@ -42,6 +40,8 @@ module.exports = {
 }
 ```
 
+Rewrites are applied to client-side routing, a `<Link href="/about">` will have the rewrite applied in the above example.
+
 `rewrites` is an async function that expects an array to be returned holding objects with `source` and `destination` properties:
 
 - `source`: `String` - is the incoming request path pattern.
@@ -58,8 +58,8 @@ module.exports = {
     return {
       beforeFiles: [
         // These rewrites are checked after headers/redirects
-        // and before pages/public files which allows overriding
-        // page files
+        // and before all files including _next/public files which
+        // allows overriding page files
         {
           source: '/some-page',
           destination: '/somewhere-else',

diff --git a/docs/api-reference/next/image.md b/docs/api-reference/next/image.md
@@ -101,8 +101,7 @@ When `responsive`, the image will scale the dimensions down for smaller
 viewports and scale up for larger viewports.
 
 When `fill`, the image will stretch both width and height to the dimensions of
-the parent element, usually paired with
-[object-fit](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit).
+the parent element, usually paired with the [`objectFit`](#objectFit) property.
 
 Try it out:
 

diff --git a/docs/basic-features/data-fetching.md b/docs/basic-features/data-fetching.md
@@ -72,7 +72,7 @@ The `context` parameter is an object containing the following keys:
 
 `getStaticProps` should return an object with:
 
-- `props` - A **required** object with the props that will be received by the page component. It should be a [serializable object](https://en.wikipedia.org/wiki/Serialization)
+- `props` - An **optional** object with the props that will be received by the page component. It should be a [serializable object](https://en.wikipedia.org/wiki/Serialization)
 - `revalidate` - An **optional** amount in seconds after which a page re-generation can occur. More on [Incremental Static Regeneration](#incremental-static-regeneration)
 - `notFound` - An **optional** boolean value to allow the page to return a 404 status and page. Below is an example of how it works:
 
@@ -672,7 +672,7 @@ The `context` parameter is an object containing the following keys:
 
 `getServerSideProps` should return an object with:
 
-- `props` - A **required** object with the props that will be received by the page component. It should be a [serializable object](https://en.wikipedia.org/wiki/Serialization)
+- `props` - An **optional** object with the props that will be received by the page component. It should be a [serializable object](https://en.wikipedia.org/wiki/Serialization)
 - `notFound` - An **optional** boolean value to allow the page to return a 404 status and page. Below is an example of how it works:
 
   ```js

diff --git a/errors/no-sync-scripts.md b/errors/no-sync-scripts.md
@@ -16,7 +16,7 @@ import Script from 'next/experimental-script'
 const Home = () => {
   return (
     <div class="container">
-      <Script src="https://third-party-script.js" strategy="defer"></Script>
+      <Script src="https://third-party-script.js"></Script>
       <div>Home Page</div>
     </div>
   )

diff --git a/examples/cms-ghost/README.md b/examples/cms-ghost/README.md
@@ -2,7 +2,7 @@
 
 This example showcases Next.js's [Static Generation](https://nextjs.org/docs/basic-features/pages) feature using [Ghost](https://ghost.org/) as the data source.
 
-> This boilerplate demonstrates simple usage and best practices. If you are looking for a more feature richt Next.js generator for Ghost including the Casper theme,
+> This boilerplate demonstrates simple usage and best practices. If you are looking for a more feature rich Next.js generator for Ghost including the Casper theme,
 > check out [next-cms-ghost](https://github.com/styxlab/next-cms-ghost).
 
 ## Deploy your own

diff --git a/examples/with-supertokens/package.json b/examples/with-supertokens/package.json
@@ -11,7 +11,7 @@
     "next": "latest",
     "react": "17.0.1",
     "react-dom": "17.0.1",
-    "supertokens-auth-react": "^0.12.0",
+    "supertokens-auth-react": "^0.13.0",
     "supertokens-node": "^5.0.0"
   },
   "license": "MIT"

diff --git a/examples/with-supertokens/pages/index.js b/examples/with-supertokens/pages/index.js
@@ -42,13 +42,17 @@ export default function Home(props) {
 function ProtectedPage({ userId }) {
   async function logoutClicked() {
     await ThirdPartyEmailPassword.signOut()
-    window.location.href = '/auth'
+    ThirdPartyEmailPassword.redirectToAuth()
   }
 
   async function fetchUserData() {
     const res = await fetch('/api/user')
-    const json = await res.json()
-    alert(JSON.stringify(json))
+    if (res.status === 401) {
+      ThirdPartyEmailPassword.redirectToAuth()
+    } else {
+      const json = await res.json()
+      alert(JSON.stringify(json))
+    }
   }
 
   return (

diff --git a/lerna.json b/lerna.json
@@ -17,5 +17,5 @@
       "registry": "https://registry.npmjs.org/"
     }
   },
-  "version": "10.2.1-canary.5"
+  "version": "10.2.1-canary.8"
 }
diff --git a/package.json b/package.json
@@ -87,6 +87,7 @@
     "image-size": "0.9.3",
     "is-animated": "2.0.0",
     "isomorphic-unfetch": "3.0.0",
+    "jest": "27.0.0-next.8",
     "ky": "0.19.1",
     "ky-universal": "0.6.0",
     "lerna": "4.0.0",
@@ -119,6 +120,8 @@
     "selenium-standalone": "6.18.0",
     "selenium-webdriver": "4.0.0-alpha.7",
     "shell-quote": "1.7.2",
+    "sqlite": "4.0.22",
+    "sqlite3": "5.0.2",
     "styled-components": "5.1.0",
     "styled-jsx-plugin-postcss": "3.0.2",
     "tailwindcss": "1.1.3",
@@ -128,12 +131,11 @@
     "wait-port": "0.2.2",
     "web-streams-polyfill": "2.1.1",
     "webpack-bundle-analyzer": "4.3.0",
-    "worker-loader": "3.0.7",
-    "jest": "27.0.0-next.8"
+    "worker-loader": "3.0.7"
   },
   "resolutions": {
-    "browserslist": "4.16.1",
-    "caniuse-lite": "1.0.30001179"
+    "browserslist": "4.16.6",
+    "caniuse-lite": "1.0.30001228"
   },
   "engines": {
     "node": ">= 10.13.0"

diff --git a/packages/create-next-app/README.md b/packages/create-next-app/README.md
@@ -19,7 +19,7 @@ npx create-next-app blog-app
 - **--ts, --typescript** - Initialize as a TypeScript project.
 - **-e, --example [name]|[github-url]** - An example to bootstrap the app with. You can use an example name from the [Next.js repo](https://github.com/vercel/next.js/tree/master/examples) or a GitHub URL. The URL can use any branch and/or subdirectory.
 - **--example-path &lt;path-to-example&gt;** - In a rare case, your GitHub URL might contain a branch name with a slash (e.g. bug/fix-1) and the path to the example (e.g. foo/bar). In this case, you must specify the path to the example separately: `--example-path foo/bar`
-- **--use-npm** - Explicitly tell the CLI to bootstrap the app using npm. Yarn will be used by default if it's installed
+- **--use-npm** - Explicitly tell the CLI to bootstrap the app using npm. To bootstrap using yarn we recommend to run `yarn create next-app`
 
 ## Why use Create Next App?
 

diff --git a/packages/create-next-app/create-app.ts b/packages/create-next-app/create-app.ts
@@ -212,7 +212,7 @@ export async function createApp({
      * TypeScript projects will have type definitions and other devDependencies.
      */
     if (typescript) {
-      devDependencies.push('typescript', '@types/react', '@types/next')
+      devDependencies.push('typescript', '@types/react')
     }
     /**
      * Install package.json dependencies if they exist.

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.2.1-canary.5",
+  "version": "10.2.1-canary.8",
   "keywords": [
     "react",
     "next",

diff --git a/packages/eslint-config-next/package.json b/packages/eslint-config-next/package.json
@@ -1,6 +1,6 @@
 {
   "name": "eslint-config-next",
-  "version": "10.2.1-canary.5",
+  "version": "10.2.1-canary.8",
   "description": "ESLint configuration used by NextJS.",
   "main": "index.js",
   "license": "MIT",

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.2.1-canary.5",
+  "version": "10.2.1-canary.8",
   "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.2.1-canary.5",
+  "version": "10.2.1-canary.8",
   "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.2.1-canary.5",
+  "version": "10.2.1-canary.8",
   "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.2.1-canary.5",
+  "version": "10.2.1-canary.8",
   "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.2.1-canary.5",
+  "version": "10.2.1-canary.8",
   "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.2.1-canary.5",
+  "version": "10.2.1-canary.8",
   "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.2.1-canary.5",
+  "version": "10.2.1-canary.8",
   "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.2.1-canary.5",
+  "version": "10.2.1-canary.8",
   "description": "A polyfill for non-dead, nomodule browsers.",
   "main": "dist/polyfill-nomodule.js",
   "license": "MIT",

diff --git a/packages/next/build/babel/preset.ts b/packages/next/build/babel/preset.ts
@@ -41,7 +41,6 @@ type NextBabelPresetOptions = {
   'preset-react'?: any
   'class-properties'?: any
   'transform-runtime'?: any
-  'experimental-modern-preset'?: PluginItem
   'styled-jsx'?: StyledJsxBabelOptions
   'preset-typescript'?: any
 }
@@ -89,10 +88,6 @@ export default (
     (Boolean(api.caller((caller: any) => !!caller && caller.hasJsxRuntime)) &&
       options['preset-react']?.runtime !== 'classic')
 
-  const isLaxModern =
-    options['preset-env']?.targets &&
-    options['preset-env'].targets.esmodules === true
-
   const presetEnvConfig = {
     // In the test environment `modules` is often needed to be set to true, babel figures that out by itself using the `'auto'` option
     // In production/development this option is set to `false` so that webpack can handle import/export with tree-shaking
@@ -122,17 +117,10 @@ export default (
     }
   }
 
-  // specify a preset to use instead of @babel/preset-env
-  const customModernPreset =
-    isLaxModern && options['experimental-modern-preset']
-
   return {
     sourceType: 'unambiguous',
     presets: [
-      customModernPreset || [
-        require('next/dist/compiled/babel/preset-env'),
-        presetEnvConfig,
-      ],
+      [require('next/dist/compiled/babel/preset-env'), presetEnvConfig],
       [
         require('next/dist/compiled/babel/preset-react'),
         {

diff --git a/packages/next/build/index.ts b/packages/next/build/index.ts
@@ -79,6 +79,7 @@ import { trace, setGlobal } from '../telemetry/trace'
 import {
   collectPages,
   detectConflictingPaths,
+  computeFromManifest,
   getJsPageSizeInKb,
   PageInfo,
   printCustomRoutes,
@@ -715,6 +716,11 @@ export default async function build(
       // eslint-disable-next-line no-shadow
       let hasSsrAmpPages = false
 
+      const computedManifestData = await computeFromManifest(
+        buildManifest,
+        distDir,
+        config.experimental.gzipSize
+      )
       await Promise.all(
         pageKeys.map(async (page) => {
           const checkPageSpan = staticCheckSpan.traceChild('check-page', {
@@ -725,7 +731,9 @@ export default async function build(
             const [selfSize, allSize] = await getJsPageSizeInKb(
               actualPage,
               distDir,
-              buildManifest
+              buildManifest,
+              config.experimental.gzipSize,
+              computedManifestData
             )
 
             let isSsg = false
@@ -1531,6 +1539,7 @@ export default async function build(
         useStatic404,
         pageExtensions: config.pageExtensions,
         buildManifest,
+        gzipSize: config.experimental.gzipSize,
       })
     )