feat(ci): Add Node 18 to test matrix

Author: AbhiPrasad

.github/workflows/build.yml

@@ -245,7 +245,7 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node: [8, 10, 12, 14, 16]
+        node: [8, 10, 12, 14, 16, 18]
     steps:
       - name: Check out current commit (${{ env.HEAD_COMMIT }})
         uses: actions/checkout@v2
@@ -282,7 +282,7 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node: [10, 12, 14, 16]
+        node: [10, 12, 14, 16, 18]
     steps:
       - name: Check out current commit (${{ env.HEAD_COMMIT }})
         uses: actions/checkout@v2
@@ -482,7 +482,7 @@ jobs:
     continue-on-error: true
     strategy:
       matrix:
-        node: [10, 12, 14, 16]
+        node: [10, 12, 14, 16, 18]
     steps:
       - name: Check out current commit (${{ github.sha }})
         uses: actions/checkout@v2

packages/nextjs/test/run-integration-tests.sh

@@ -78,6 +78,14 @@ for NEXTJS_VERSION in 10 11 12; do
       WEBPACK_VERSION=5 ||
       WEBPACK_VERSION=4
 
+    # Node v18 only with Webpack 5 and above
+    # https://github.com/webpack/webpack/issues/14532#issuecomment-947513562
+    # Context: https://github.com/vercel/next.js/issues/30078#issuecomment-947338268
+    if [ "$NODE_MAJOR" -gt "17" ] && [ "$WEBPACK_VERSION" -eq "4" ]; then
+      echo "[nextjs$NEXTJS_VERSION | webpack@$WEBPACK_VERSION] Node $NODE_MAJOR not compatible with Webpack $WEBPACK_VERSION"
+      exit 0
+    fi
+
     # next 10 defaults to webpack 4 and next 11 defaults to webpack 5, but each can use either based on settings
     if [ "$NEXTJS_VERSION" -eq "10" ]; then
       sed "s/%RUN_WEBPACK_5%/$RUN_WEBPACK_5/g" <next10.config.template >next.config.js

packages/node/test/manual/webpack-domain/npm-build.js

@@ -2,6 +2,11 @@ const path = require('path');
 const webpack = require('webpack');
 const { execSync } = require('child_process');
 
+// Webpack test does not work in Node 18 and above.
+if (Number(process.versions.node.split('.')[0]) >= 18) {
+  return;
+}
+
 // prettier-ignore
 webpack(
   {
@@ -13,7 +18,7 @@ webpack(
     target: 'node',
     mode: 'development',
   },
-  function(err, stats) {
+  function (err, stats) {
     if (err) {
       console.error(err.stack || err);
       if (err.details) {