@netlify/plugin-nextjs 4.0.0-beta.3 → 4.0.0-beta.7

package/README.md

@@ -2,8 +2,8 @@
 
 # Essential Next.js Build Plugin (beta)
 
-
-:warning: This is the beta version of the Essential Next.js plugin. For the stable version, see [Essential Next.js plugin v3](https://github.com/netlify/netlify-plugin-nextjs/tree/v3#readme) :warning:
+:warning: This is the beta version of the Essential Next.js plugin. For the stable version, refer to
+[Essential Next.js plugin v3](https://github.com/netlify/netlify-plugin-nextjs/tree/v3#readme) :warning:
 
 <p align="center">
   <a aria-label="npm version" href="https://www.npmjs.com/package/@netlify/plugin-nextjs">
@@ -14,15 +14,21 @@
   </a>
 </p>
 
+## What's new in this version
 
-## Installing the beta
+Version 4 is a complete rewrite of the Essential Next.js plugin. For full details of everything that's new, check out
+[the v4 release notes](https://github.com/netlify/netlify-plugin-nextjs/blob/main/docs/release-notes/v4.md)
 
+## Installing the beta
 
 - Install the module:
+
 ```shell
 npm install -D @netlify/plugin-nextjs@beta
 ```
-- Change the `publish` directory to `.next`  and add the plugin to `netlify.toml` if not already installed:
+
+- Change the `publish` directory to `.next` and add the plugin to `netlify.toml` if not already installed:
+
 ```toml
 [build]
 publish = ".next"
@@ -31,14 +37,27 @@ publish = ".next"
 package = "@netlify/plugin-nextjs"
 ```
 
-If you previously set `target: "serverless"` or a custom `distDir` in your `next.config.js`, or set `node_bundler` or `external_node_modules` in your `netlify.toml` these are no longer needed and can be removed. 
+If you previously set a custom `distDir` in your `next.config.js`, or set `node_bundler` or `external_node_modules` in
+your `netlify.toml` these are no longer needed and can be removed.
+
+The `serverless` and `experimental-serverless-trace` targets are deprecated in Next 12, and all builds with this plugin
+will now use the default `server` target. If you previously set the target in your `next.config.js`, you should remove
+it.
+
+If you are using a monorepo you will need to change `publish` to point to the full path to the built `.next` directory,
+which may be in a subdirectory. If you have changed your `distDir` then it will need to match that.
 
-The `serverless` and `experimental-serverless-trace` targets are deprecated in Next 12, and all builds with this plugin will now use the default `server` target.
+If you are using Nx, then you will need to point `publish` to the folder inside `dist`, e.g. `dist/apps/myapp/.next`.
 
-If you are using a monorepo you will need to change `publish` to point to the full path to the built `.next` directory, which may be in a subdirectory. If you have changed your `distDir` then it will need to match that. 
+If you currently use redirects or rewrites on your site, see
+[the Rewrites and Redirects guide](https://github.com/netlify/netlify-plugin-nextjs/blob/main/docs/redirects-rewrites.md)
+for information on changes to how they are handled in this version.
 
-If you are using Nx, then you will need to point `publish` to the folder inside `dist`, e.g. `dist/apps/myapp/.next`. 
+If you want to use Next 12's beta Middleware feature, this will mostly work as expected but please
+[read the docs on some caveats and workarounds](https://github.com/netlify/netlify-plugin-nextjs/blob/main/docs/middleware.md)
+that are currently needed.
 
 ## Beta feedback
 
-Please share any thoughts, feedback or questions about the beta [in our discussion](https://github.com/netlify/netlify-plugin-nextjs/discussions/706).
+Please share any thoughts, feedback or questions about the beta
+[in our discussion](https://github.com/netlify/netlify-plugin-nextjs/discussions/706).

package/lib/helpers/config.js

@@ -1,5 +1,5 @@
 // @ts-check
-const { readJSON } = require('fs-extra');
+const { readJSON, existsSync } = require('fs-extra');
 const { join, dirname, relative } = require('pathe');
 const slash = require('slash');
 const defaultFailBuild = (message, { error }) => {
@@ -64,8 +64,8 @@ exports.generateRedirects = async ({ netlifyConfig, basePath, i18n }) => {
         from: `${basePath}/*`,
         to: HANDLER_FUNCTION_PATH,
         status: 200,
-        force: true,
         conditions: { Cookie: ['__prerender_bypass', '__next_preview_data'] },
+        force: true,
     }, ...redirects.map((redirect) => ({
         from: `${basePath}${redirect}`,
         to: ODB_FUNCTION_PATH,
@@ -92,6 +92,7 @@ const resolveModuleRoot = (moduleName) => {
         return null;
     }
 };
+const DEFAULT_EXCLUDED_MODULES = ['sharp', 'electron'];
 exports.configureHandlerFunctions = ({ netlifyConfig, publish, ignore = [] }) => {
     var _a;
     /* eslint-disable no-underscore-dangle */
@@ -102,14 +103,16 @@ exports.configureHandlerFunctions = ({ netlifyConfig, publish, ignore = [] }) =>
         (_a = netlifyConfig.functions)[functionName] || (_a[functionName] = { included_files: [], external_node_modules: [] });
         netlifyConfig.functions[functionName].node_bundler = 'nft';
         (_b = netlifyConfig.functions[functionName]).included_files || (_b.included_files = []);
-        netlifyConfig.functions[functionName].included_files.push(`${publish}/server/**`, `${publish}/serverless/**`, `${publish}/*.json`, `${publish}/BUILD_ID`, ...ignore.map((path) => `!${slash(path)}`));
+        netlifyConfig.functions[functionName].included_files.push(`${publish}/server/**`, `${publish}/serverless/**`, `${publish}/*.json`, `${publish}/BUILD_ID`, `${publish}/static/chunks/webpack-middleware*.js`, `!${publish}/server/**/*.js.nft.json`, ...ignore.map((path) => `!${slash(path)}`));
         const nextRoot = resolveModuleRoot('next');
         if (nextRoot) {
             netlifyConfig.functions[functionName].included_files.push(`!${nextRoot}/dist/server/lib/squoosh/**/*.wasm`, `!${nextRoot}/dist/next-server/server/lib/squoosh/**/*.wasm`, `!${nextRoot}/dist/compiled/webpack/bundle4.js`, `!${nextRoot}/dist/compiled/webpack/bundle5.js`, `!${nextRoot}/dist/compiled/terser/bundle.min.js`);
         }
-        const sharpRoot = resolveModuleRoot('sharp');
-        if (sharpRoot) {
-            netlifyConfig.functions[functionName].included_files.push(`!${sharpRoot}/**/*`);
-        }
+        DEFAULT_EXCLUDED_MODULES.forEach((moduleName) => {
+            const moduleRoot = resolveModuleRoot(moduleName);
+            if (moduleRoot) {
+                netlifyConfig.functions[functionName].included_files.push(`!${moduleRoot}/**/*`);
+            }
+        });
     });
 };

package/lib/helpers/files.js

@@ -1,43 +1,46 @@
 //  @ts-check
+const { cpus } = require('os');
 const { existsSync, readJson, move, cpSync, copy, writeJson } = require('fs-extra');
+const globby = require('globby');
 const pLimit = require('p-limit');
 const { join } = require('pathe');
-const TEST_ROUTE = /\/\[[^/]+?](?=\/|$)/;
+const slash = require('slash');
+const TEST_ROUTE = /(|\/)\[[^/]+?](\/|\.html|$)/;
 const isDynamicRoute = (route) => TEST_ROUTE.test(route);
 exports.moveStaticPages = async ({ netlifyConfig, target, i18n, failBuild }) => {
-    const root = join(netlifyConfig.build.publish, target === 'server' ? 'server' : 'serverless');
-    const pagesManifestPath = join(root, 'pages-manifest.json');
-    if (!existsSync(pagesManifestPath)) {
-        failBuild(`Could not find pages manifest at ${pagesManifestPath}`);
-    }
+    console.log('Moving static page files to serve from CDN...');
+    const root = join(netlifyConfig.build.publish, target === 'server' ? 'server' : 'serverless', 'pages');
     const files = [];
     const moveFile = async (file) => {
         const source = join(root, file);
-        // Trim the initial "pages"
-        const filePath = file.slice(6);
-        files.push(filePath);
-        const dest = join(netlifyConfig.build.publish, filePath);
+        files.push(file);
+        const dest = join(netlifyConfig.build.publish, file);
         await move(source, dest);
     };
-    const pagesManifest = await readJson(pagesManifestPath);
-    // Arbitrary limit of 10 concurrent file moves
-    const limit = pLimit(10);
-    const promises = Object.entries(pagesManifest).map(async ([route, filePath]) => {
-        if (isDynamicRoute(route) ||
-            !(filePath.endsWith('.html') || filePath.endsWith('.json')) ||
-            filePath.endsWith('/404.html') ||
-            filePath.endsWith('/500.html')) {
+    // Move all static files, except error documents and nft manifests
+    const pages = await globby(['**/*.{html,json}', '!**/(500|404|*.js.nft).{html,json}'], {
+        cwd: root,
+        dot: true,
+    });
+    // Limit concurrent file moves to number of cpus or 2 if there is only 1
+    const limit = pLimit(Math.max(2, cpus().length));
+    const promises = pages.map(async (rawPath) => {
+        const filePath = slash(rawPath);
+        if (isDynamicRoute(filePath)) {
             return;
         }
         return limit(moveFile, filePath);
     });
     await Promise.all(promises);
-    console.log(`Moved ${files.length} page files`);
+    console.log(`Moved ${files.length} files`);
     // Write the manifest for use in the serverless functions
     await writeJson(join(netlifyConfig.build.publish, 'static-manifest.json'), files);
     if (i18n === null || i18n === void 0 ? void 0 : i18n.defaultLocale) {
         // Copy the default locale into the root
-        await copy(join(netlifyConfig.build.publish, i18n.defaultLocale), `${netlifyConfig.build.publish}/`);
+        const defaultLocaleDir = join(netlifyConfig.build.publish, i18n.defaultLocale);
+        if (existsSync(defaultLocaleDir)) {
+            await copy(defaultLocaleDir, `${netlifyConfig.build.publish}/`);
+        }
     }
 };
 exports.movePublicFiles = async ({ appDir, publish }) => {

package/lib/helpers/verification.js

@@ -1,7 +1,7 @@
 const { existsSync, promises } = require('fs');
 const path = require('path');
 const { relative } = require('path');
-const { yellowBright, greenBright, blueBright, redBright } = require('chalk');
+const { yellowBright, greenBright, blueBright, redBright, reset } = require('chalk');
 const { async: StreamZip } = require('node-stream-zip');
 const outdent = require('outdent');
 const prettyBytes = require('pretty-bytes');
@@ -17,6 +17,21 @@ exports.verifyNetlifyBuildVersion = ({ IS_LOCAL, NETLIFY_BUILD_VERSION, failBuil
     `);
     }
 };
+exports.checkForOldFunctions = async ({ functions }) => {
+    const oldFunctions = (await functions.list()).filter(({ name }) => name.startsWith('next_'));
+    if (oldFunctions.length !== 0) {
+        console.log(yellowBright(outdent `
+      We have found the following functions in your site that seem to be left over from the old Next.js plugin (v3). We have guessed this because the name starts with "next_".
+
+      ${reset(oldFunctions.map(({ name }) => `- ${name}`).join('\n'))}
+
+      If they were created by the old plugin, these functions are likely to cause errors so should be removed. You can do this by deleting the following directories:
+
+      ${reset(oldFunctions.map(({ mainFile }) => `- ${path.relative(process.cwd(), path.dirname(mainFile))}`).join('\n'))}
+
+    `));
+    }
+};
 exports.checkNextSiteHasBuilt = ({ publish, failBuild }) => {
     if (!existsSync(path.join(publish, 'BUILD_ID'))) {
         return failBuild(outdent `

package/lib/index.js

@@ -1,12 +1,11 @@
-// @ts-check
 const { join, relative } = require('path');
-const { copy, existsSync } = require('fs-extra');
 const { ODB_FUNCTION_NAME } = require('./constants');
 const { restoreCache, saveCache } = require('./helpers/cache');
 const { getNextConfig, configureHandlerFunctions, generateRedirects } = require('./helpers/config');
 const { moveStaticPages, movePublicFiles } = require('./helpers/files');
 const { generateFunctions, setupImageFunction, generatePagesResolver } = require('./helpers/functions');
-const { verifyNetlifyBuildVersion, checkNextSiteHasBuilt, checkForRootPublish, logBetaMessage, checkZipSize, } = require('./helpers/verification');
+const { verifyNetlifyBuildVersion, checkNextSiteHasBuilt, checkForRootPublish, logBetaMessage, checkZipSize, checkForOldFunctions, } = require('./helpers/verification');
+/** @type import("@netlify/build").NetlifyPlugin */
 module.exports = {
     async onPreBuild({ constants, netlifyConfig, utils: { build: { failBuild }, cache, }, }) {
         var _a;
@@ -37,9 +36,10 @@ module.exports = {
             i18n,
         });
     },
-    async onPostBuild({ netlifyConfig, utils: { cache }, constants }) {
+    async onPostBuild({ netlifyConfig, utils: { cache, functions }, constants: { FUNCTIONS_DIST } }) {
         await saveCache({ cache, publish: netlifyConfig.build.publish });
-        await checkZipSize(join(process.cwd(), constants.FUNCTIONS_DIST, `${ODB_FUNCTION_NAME}.zip`));
+        await checkForOldFunctions({ functions });
+        await checkZipSize(join(FUNCTIONS_DIST, `${ODB_FUNCTION_NAME}.zip`));
     },
     onEnd() {
         logBetaMessage();

package/lib/templates/getHandler.js

@@ -103,6 +103,8 @@ const makeHandler = () =>
     bridge.listen();
     return async (event, context) => {
         var _a, _b, _c, _d;
+        // Ensure that paths are encoded - but don't double-encode them
+        event.path = new URL(event.path, event.rawUrl).pathname;
         // Next expects to be able to parse the query from the URL
         const query = new URLSearchParams(event.queryStringParameters).toString();
         event.path = query ? `${event.path}?${query}` : event.path;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@netlify/plugin-nextjs",
-  "version": "4.0.0-beta.3",
+  "version": "4.0.0-beta.7",
   "description": "Run Next.js seamlessly on Netlify",
   "main": "lib/index.js",
   "files": [
@@ -10,7 +10,7 @@
   "scripts": {
     "build:demo": "next build demo",
     "cy:open": "cypress open --config-file cypress/config/all.json",
-    "cy:run": "cypress run --config-file cypress/config/all.json",
+    "cy:run": "cypress run --config-file ../cypress/config/ci.json",
     "dev:demo": "next dev demo",
     "format": "run-s format:check-fix:*",
     "format:ci": "run-s format:check:*",
@@ -52,13 +52,14 @@
   },
   "homepage": "https://github.com/netlify/netlify-plugin-nextjs#readme",
   "dependencies": {
-    "@netlify/functions": "^0.7.2",
+    "@netlify/functions": "^0.9.0",
     "@netlify/ipx": "^0.0.7",
     "@vercel/node": "^1.11.2-canary.4",
     "chalk": "^4.1.2",
     "fs-extra": "^10.0.0",
+    "globby": "^11.0.4",
     "moize": "^6.1.0",
-    "node-fetch": "^2.6.5",
+    "node-fetch": "^2.6.6",
     "node-stream-zip": "^1.15.0",
     "outdent": "^0.8.0",
     "p-limit": "^3.1.0",
@@ -71,6 +72,7 @@
   "devDependencies": {
     "@babel/core": "^7.15.8",
     "@babel/preset-env": "^7.15.8",
+    "@netlify/build": "^18.23.0",
     "@netlify/eslint-config-node": "^3.3.0",
     "@testing-library/cypress": "^8.0.1",
     "@types/fs-extra": "^9.0.13",
@@ -83,7 +85,7 @@
     "husky": "^4.3.0",
     "jest": "^27.0.0",
     "netlify-plugin-cypress": "^2.2.0",
-    "next": "^11.1.2",
+    "next": "^12.0.2",
     "npm-run-all": "^4.1.5",
     "prettier": "^2.1.2",
     "react": "^17.0.1",