Update nextjs monorepo to v12 (major) (#6835)

Co-authored-by: Renovate Bot <bot@renovateapp.com> Co-authored-by: Daniel Cousens <413395+dcousens@users.noreply.github.com> Co-authored-by: mitchellhamilton <mitchell@hamil.town>
keystonejs · Nov 1, 2021 · 6a0c938 · 6a0c938
1 parent 2c85a2a
commit 6a0c938
Show file tree

Hide file tree

Showing 19 changed files with 185 additions and 291 deletions.
diff --git a/design-system/website/package.json b/design-system/website/package.json
@@ -20,11 +20,11 @@
     "@keystone-ui/segmented-control": "^5.0.1",
     "@keystone-ui/toast": "^4.0.4",
     "@keystone-ui/tooltip": "^4.0.3",
-    "@preconstruct/next": "^3.0.0",
+    "@preconstruct/next": "^3.0.1",
     "@types/react": "^17.0.33",
     "@types/react-dom": "^17.0.10",
     "@types/tinycolor2": "^1.4.3",
-    "next": "^11.1.0",
+    "next": "^12.0.2",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "tinycolor2": "^1.4.2"

diff --git a/docs/package.json b/docs/package.json
@@ -18,8 +18,8 @@
     "@keystone-next/fields-document": "^11.0.0",
     "@mdx-js/loader": "next",
     "@mdx-js/react": "^1.6.22",
-    "@next/mdx": "^11.1.0",
-    "@preconstruct/next": "^3.0.0",
+    "@next/mdx": "^12.0.2",
+    "@preconstruct/next": "^3.0.1",
     "@sindresorhus/slugify": "^1.1.2",
     "@types/gtag.js": "^0.0.7",
     "@types/mdx-js__react": "^1.5.5",
@@ -30,7 +30,7 @@
     "date-fns": "^2.25.0",
     "facepaint": "^1.2.1",
     "lodash.debounce": "^4.0.8",
-    "next": "^11.1.0",
+    "next": "^12.0.2",
     "next-compose-plugins": "^2.2.1",
     "prism-react-renderer": "^1.2.1",
     "react": "^17.0.2",

diff --git a/examples-staging/auth/package.json b/examples-staging/auth/package.json
@@ -11,7 +11,7 @@
   "dependencies": {
     "@keystone-next/auth": "^34.0.0",
     "@keystone-next/keystone": "^26.1.0",
-    "next": "^11.1.0",
+    "next": "^12.0.2",
     "react": "^17.0.2",
     "react-dom": "^17.0.2"
   },

diff --git a/examples-staging/basic/package.json b/examples-staging/basic/package.json
@@ -18,11 +18,11 @@
     "@keystone-ui/fields": "^5.0.1",
     "@keystone-ui/icons": "^4.0.2",
     "@keystone-ui/tooltip": "^4.0.3",
-    "@preconstruct/next": "^3.0.0",
+    "@preconstruct/next": "^3.0.1",
     "@types/react": "^17.0.33",
     "graphql": "^15.6.1",
     "graphql-tag": "^2.12.5",
-    "next": "^11.1.0",
+    "next": "^12.0.2",
     "react": "^17.0.2",
     "react-dom": "^17.0.2"
   },

diff --git a/examples-staging/ecommerce/package.json b/examples-staging/ecommerce/package.json
@@ -21,7 +21,7 @@
     "@keystone-next/keystone": "^26.1.0",
     "@types/nodemailer": "^6.4.4",
     "dotenv": "^10.0.0",
-    "next": "^11.1.0",
+    "next": "^12.0.2",
     "nodemailer": "^6.7.0",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",

diff --git a/examples-staging/embedded-nextjs/package.json b/examples-staging/embedded-nextjs/package.json
@@ -11,7 +11,7 @@
   "dependencies": {
     "@keystone-next/keystone": "^26.1.0",
     "dotenv": "^10.0.0",
-    "next": "^11.1.0",
+    "next": "^12.0.2",
     "react": "^17.0.2",
     "react-dom": "^17.0.2"
   },

diff --git a/examples-staging/roles/package.json b/examples-staging/roles/package.json
@@ -11,7 +11,7 @@
   "dependencies": {
     "@keystone-next/auth": "^34.0.0",
     "@keystone-next/keystone": "^26.1.0",
-    "next": "^11.1.0",
+    "next": "^12.0.2",
     "react": "^17.0.2",
     "react-dom": "^17.0.2"
   },

diff --git a/examples/custom-admin-ui-logo/package.json b/examples/custom-admin-ui-logo/package.json
@@ -11,7 +11,7 @@
   "dependencies": {
     "@keystone-next/keystone": "^26.1.0",
     "@keystone-ui/core": "^3.2.1",
-    "next": "^11.1.0",
+    "next": "^12.0.2",
     "react": "^17.0.2"
   },
   "devDependencies": {

diff --git a/examples/document-field/package.json b/examples/document-field/package.json
@@ -13,8 +13,8 @@
     "@keystone-next/document-renderer": "^4.0.1",
     "@keystone-next/fields-document": "^11.0.0",
     "@keystone-next/keystone": "^26.1.0",
-    "@preconstruct/next": "^3.0.0",
-    "next": "^11.1.0",
+    "@preconstruct/next": "^3.0.1",
+    "next": "^12.0.2",
     "react": "^17.0.2"
   },
   "devDependencies": {

diff --git a/packages/keystone/package.json b/packages/keystone/package.json
@@ -48,7 +48,7 @@
     "@keystone-ui/segmented-control": "^5.0.1",
     "@keystone-ui/toast": "^4.0.4",
     "@keystone-ui/tooltip": "^4.0.3",
-    "@preconstruct/next": "^3.0.0",
+    "@preconstruct/next": "^3.0.1",
     "@prisma/client": "3.3.0",
     "@prisma/migrate": "3.3.0",
     "@prisma/sdk": "3.3.0",
@@ -104,7 +104,7 @@
     "memoize-one": "^6.0.0",
     "meow": "^9.0.0",
     "micro": "^9.3.4",
-    "next": "^11.1.0",
+    "next": "^12.0.2",
     "node-fetch": "^2.6.5",
     "normalize-path": "^3.0.0",
     "object-hash": "^2.2.0",

diff --git a/packages/keystone/src/___internal-do-not-use-will-break-in-patch/admin-ui/next-config.ts b/packages/keystone/src/___internal-do-not-use-will-break-in-patch/admin-ui/next-config.ts
@@ -28,6 +28,7 @@ export const config = withPreconstruct({
       // to resolve the location of field views, we will get a path that we can use
       // rather than just the __dirname/__filename of the generated file.
       // https://webpack.js.org/configuration/node/#node__filename
+      config.node ??= {};
       config.node.__dirname = true;
       config.node.__filename = true;
     }

diff --git a/packages/keystone/src/admin-ui/system/buildAdminUI.ts b/packages/keystone/src/admin-ui/system/buildAdminUI.ts
@@ -1,4 +1,7 @@
 export async function buildAdminUI(projectAdminPath: string) {
+  if (process.env.NODE_ENV !== 'production') {
+    throw new Error('process.env.NODE_ENV must be set to production to build the Admin UI');
+  }
   // importing next/dist/build is quite expensive so we're requiring it lazily
   /** We do this to stop webpack from bundling next inside of next */
   const next = 'next/dist/build';

diff --git a/packages/keystone/src/admin-ui/templates/app.ts b/packages/keystone/src/admin-ui/templates/app.ts
@@ -35,6 +35,10 @@ export const appTemplate = (
   const adminMetaQueryResultHash = hashString(JSON.stringify(adminMeta));
 
   const allViews = adminMetaRootVal.views.map(views => {
+    // webpack/next for some reason _sometimes_ adds a query parameter to the return of require.resolve
+    // because it does it _sometimes_, we have to remove it so that during live reloading
+    // we're not constantly doing builds because the query param is there and then it's not and then it is and so on
+    views = views.replace(/\?[A-Za-z0-9]+$/, '');
     // during a live reload, we'll have paths from a webpack compilation which will make the paths
     // that __dirname/__filename/require.resolve return relative to the webpack's "context" option
     // which for Next, it's set to the directory of the Next project which is projectAdminPath here.

diff --git a/packages/keystone/src/scripts/build/build.ts b/packages/keystone/src/scripts/build/build.ts
@@ -55,6 +55,10 @@ const reexportKeystoneConfig = async (cwd: string, isDisabled?: boolean) => {
 };
 
 export async function build(cwd: string) {
+  // Next does a broken build unless we set NODE_ENV to production
+  // @ts-ignore
+  process.env.NODE_ENV = 'production';
+
   const config = initConfig(requireSource(getConfigPath(cwd)).default);
 
   const { graphQLSchema, adminMeta } = createSystem(config);

diff --git a/packages/keystone/src/scripts/tests/build.test.ts b/packages/keystone/src/scripts/tests/build.test.ts
@@ -78,7 +78,6 @@ test('build works with typescript without the user defining a babel config', asy
     ✨ Generating Admin UI code
     ✨ Generating Keystone config code
     ✨ Building Admin UI
-    info  - Using webpack 5. Reason: Enabled by default https://nextjs.org/docs/messages/webpack5
     info  - Skipping validation of types...
     info  - Creating an optimized production build...
     info  - Compiled successfully
@@ -91,8 +90,6 @@ test('build works with typescript without the user defining a babel config', asy
     next build size report
     λ  (Server)  server-side renders at runtime (uses getInitialProps or getServerSideProps)
     ○  (Static)  automatically rendered as static HTML (uses no initial props)
-    ●  (SSG)     automatically generated as static HTML + JSON (uses getStaticProps)
-       (ISR)     incremental static regeneration (uses revalidate in getStaticProps)
     "
   `);
   expect(result.exitCode).toBe(0);

diff --git a/packages/keystone/static/tsconfig.json b/packages/keystone/static/tsconfig.json
@@ -14,7 +14,8 @@
     "module": "esnext",
     "moduleResolution": "node",
     "resolveJsonModule": true,
-    "isolatedModules": true
+    "isolatedModules": true,
+    "incremental": true
   },
   "exclude": ["node_modules"],
   "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"]

diff --git a/tests/admin-ui-tests/live-reloading.test.ts b/tests/admin-ui-tests/live-reloading.test.ts
@@ -101,7 +101,7 @@ test('the generated schema includes schema updates', async () => {
 
 test("a syntax error is shown and doesn't crash the process", async () => {
   await replaceSchema('syntax-error');
-  await expectContentInStdio(process, 'error - ../../schemas/syntax-error.js:4:6');
+  await expectContentInStdio(process, 'error - ../../schemas/syntax-error.js');
 });
 
 test("a runtime error is shown and doesn't crash the process", async () => {

diff --git a/tsconfig.json b/tsconfig.json
@@ -12,7 +12,9 @@
     "forceConsistentCasingInFileNames": true /* Disallow inconsistently-cased references to the same file. */,
     "noUnusedLocals": true,
     "types": ["@types/jest"],
-    "typeRoots": []
+    "typeRoots": [],
+    // remove this when https://github.com/vercel/next.js/issues/30352 is fixed
+    "skipLibCheck": true
   },
   "include": ["**/*"],
   "exclude": ["**/node_modules/**/*"]