@nuxt/webpack-builder 3.17.3 → 4.0.0-0

package/builder.mjs

@@ -2,3 +2,4 @@ export const builder = 'webpack'
 export { default as webpack } from 'webpack'
 export { default as MiniCssExtractPlugin } from 'mini-css-extract-plugin'
 export { default as WebpackBarPlugin } from 'webpackbar'
+export { default as TsCheckerPlugin } from 'fork-ts-checker-webpack-plugin'

package/dist/index.mjs

@@ -1,18 +1,17 @@
 import pify from 'pify';
+import { join, resolve, normalize, dirname, isAbsolute } from 'pathe';
 import { fromNodeMiddleware, defineEventHandler, handleCors, getRequestHeader, createError, setHeader } from 'h3';
 import webpackDevMiddleware from 'webpack-dev-middleware';
 import webpackHotMiddleware from 'webpack-hot-middleware';
 import { defu } from 'defu';
 import { joinURL } from 'ufo';
-import { logger, useNuxt } from '@nuxt/kit';
+import { logger, importModule, useNitro, useNuxt } from '@nuxt/kit';
 import { createUnplugin } from 'unplugin';
 import MagicString from 'magic-string';
-import { webpack, WebpackBarPlugin, builder, MiniCssExtractPlugin } from '#builder';
-import { join, resolve, normalize, dirname, isAbsolute } from 'pathe';
+import { webpack, WebpackBarPlugin, builder, MiniCssExtractPlugin, TsCheckerPlugin } from '#builder';
 import { createFsFromVolume, Volume } from 'memfs';
 import querystring from 'node:querystring';
 import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
-import ForkTSCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin';
 import { defineEnv } from 'unenv';
 import TimeFixPlugin from 'time-fix-plugin';
 import FriendlyErrorsWebpackPlugin from '@nuxt/friendly-errors-webpack-plugin';
@@ -26,6 +25,8 @@ import VueLoaderPlugin from 'vue-loader/dist/pluginWebpack5.js';
 import { mkdir, writeFile } from 'node:fs/promises';
 import { normalizeWebpackManifest } from 'vue-bundle-renderer';
 import { hash } from 'ohash';
+import { glob } from 'tinyglobby';
+import { genSafeVariableName } from 'knitwork';
 
 const defaults = {
   globalPublicPath: "__webpack_public_path__",
@@ -274,7 +275,7 @@ function baseAlias(ctx) {
     ...ctx.alias
   };
   if (ctx.isClient) {
-    ctx.alias["#internal/nitro"] = resolve(ctx.nuxt.options.buildDir, "nitro.client.mjs");
+    ctx.alias["nitro/runtime"] = resolve(ctx.nuxt.options.buildDir, "nitro.client.mjs");
   }
 }
 function baseResolve(ctx) {
@@ -889,7 +890,7 @@ function clientPlugins(ctx) {
   }
   if (!ctx.nuxt.options.ssr) {
     if (!ctx.nuxt.options.test && (ctx.nuxt.options.typescript.typeCheck === true || ctx.nuxt.options.typescript.typeCheck === "build" && !ctx.nuxt.options.dev)) {
-      ctx.config.plugins.push(new ForkTSCheckerWebpackPlugin({
+      ctx.config.plugins.push(new TsCheckerPlugin({
         logger
       }));
     }
@@ -967,12 +968,12 @@ function serverStandalone(ctx) {
     ...ctx.options.build.transpile
   ];
   const external = [
-    "#internal/nitro",
+    "nitro/runtime",
     "#shared",
     resolve(ctx.nuxt.options.rootDir, ctx.nuxt.options.dir.shared)
   ];
   if (!ctx.nuxt.options.dev) {
-    external.push("#internal/nuxt/paths", "#app-manifest");
+    external.push("#internal/nuxt/paths", "#internal/nuxt/app-config", "#app-manifest");
   }
   if (!Array.isArray(ctx.config.externals)) {
     return;
@@ -999,12 +1000,97 @@ function serverPlugins(ctx) {
     }));
   }
   if (!ctx.nuxt.options.test && (ctx.nuxt.options.typescript.typeCheck === true || ctx.nuxt.options.typescript.typeCheck === "build" && !ctx.nuxt.options.dev)) {
-    ctx.config.plugins.push(new ForkTSCheckerWebpackPlugin({
+    ctx.config.plugins.push(new TsCheckerPlugin({
       logger
     }));
   }
 }
 
+const PLUGIN_NAME = "dynamic-require";
+const HELPER_DYNAMIC = `\0${PLUGIN_NAME}.mjs`;
+const DYNAMIC_REQUIRE_RE = /import\((?:.*\+\s*)?"\.\/" ?\+(.*)\).then/g;
+const BACKWARD_SLASH_RE = /\\/g;
+function dynamicRequire({ dir, ignore, inline }) {
+  return {
+    name: PLUGIN_NAME,
+    transform(code, _id) {
+      return {
+        code: code.replace(
+          DYNAMIC_REQUIRE_RE,
+          `import('${HELPER_DYNAMIC}').then(r => r.default || r).then(dynamicRequire => dynamicRequire($1)).then`
+        ),
+        map: null
+      };
+    },
+    resolveId(id) {
+      return id === HELPER_DYNAMIC ? id : null;
+    },
+    // TODO: Async chunk loading over network!
+    // renderDynamicImport () {
+    //   return {
+    //     left: 'fetch(', right: ')'
+    //   }
+    // },
+    async load(_id) {
+      if (_id !== HELPER_DYNAMIC) {
+        return null;
+      }
+      let files = [];
+      try {
+        const wpManifest = resolve(dir, "./server.manifest.json");
+        files = await importModule(wpManifest).then((r) => Object.keys(r.files).filter((file) => !ignore.includes(file)));
+      } catch {
+        files = await glob("**/*.{cjs,mjs,js}", {
+          cwd: dir,
+          absolute: false,
+          ignore
+        });
+      }
+      const chunks = (await Promise.all(
+        files.map(async (id) => ({
+          id,
+          src: resolve(dir, id).replace(BACKWARD_SLASH_RE, "/"),
+          name: genSafeVariableName(id),
+          meta: await getWebpackChunkMeta(resolve(dir, id))
+        }))
+      )).filter((chunk) => chunk.meta);
+      return inline ? TMPL_INLINE({ chunks }) : TMPL_LAZY({ chunks });
+    }
+  };
+}
+async function getWebpackChunkMeta(src) {
+  const chunk = await importModule(src) || {};
+  const { __webpack_id__, __webpack_ids__, __webpack_modules__, id = __webpack_id__, ids = __webpack_ids__, modules = __webpack_modules__ } = chunk;
+  if (!id && !ids) {
+    return null;
+  }
+  return {
+    id,
+    ids,
+    moduleIds: Object.keys(modules || {})
+  };
+}
+function TMPL_INLINE({ chunks }) {
+  return `${chunks.map((i) => `import * as ${i.name} from '${i.src}'`).join("\n")}
+const dynamicChunks = {
+  ${chunks.map((i) => ` ['${i.id}']: ${i.name}`).join(",\n")}
+};
+
+export default function dynamicRequire(id) {
+  return Promise.resolve(dynamicChunks[id]);
+};`;
+}
+function TMPL_LAZY({ chunks }) {
+  return `
+const dynamicChunks = {
+${chunks.map((i) => ` ['${i.id}']: () => import('${i.src}')`).join(",\n")}
+};
+
+export default function dynamicRequire(id) {
+  return dynamicChunks[id]();
+};`;
+}
+
 const bundle = async (nuxt) => {
   const webpackConfigs = await Promise.all([client, ...nuxt.options.ssr ? [server] : []].map(async (preset) => {
     const ctx = createWebpackConfigContext(nuxt);
@@ -1012,6 +1098,24 @@ const bundle = async (nuxt) => {
     await applyPresets(ctx, preset);
     return ctx.config;
   }));
+  if (!nuxt.options.dev) {
+    const nitro = useNitro();
+    const dynamicRequirePlugin = dynamicRequire({
+      dir: resolve(nuxt.options.buildDir, "dist/server"),
+      inline: nitro.options.node === false || nitro.options.inlineDynamicImports,
+      ignore: [
+        "client.manifest.mjs",
+        "server.js",
+        "server.cjs",
+        "server.mjs",
+        "server.manifest.mjs"
+      ]
+    });
+    const prerenderRollupPlugins = nitro.options._config.rollupConfig.plugins;
+    const rollupPlugins = nitro.options.rollupConfig.plugins;
+    prerenderRollupPlugins.push(dynamicRequirePlugin);
+    rollupPlugins.push(dynamicRequirePlugin);
+  }
   await nuxt.callHook(`${builder}:config`, webpackConfigs);
   const mfs = nuxt.options.dev ? createMFS() : null;
   for (const config of webpackConfigs) {
@@ -1032,7 +1136,7 @@ const bundle = async (nuxt) => {
   });
   nuxt.hook("close", async () => {
     for (const compiler of compilers) {
-      await new Promise((resolve) => compiler.close(resolve));
+      await new Promise((resolve2) => compiler.close(resolve2));
     }
   });
   if (nuxt.options.dev) {
@@ -1086,21 +1190,21 @@ function wdmToH3Handler(devMiddleware, corsOptions) {
       devMiddleware: devMiddleware.context
     };
     const { req, res } = event.node;
-    const body = await new Promise((resolve, reject) => {
+    const body = await new Promise((resolve2, reject) => {
       res.stream = (stream) => {
-        resolve(stream);
+        resolve2(stream);
       };
       res.send = (data) => {
-        resolve(data);
+        resolve2(data);
       };
       res.finish = (data) => {
-        resolve(data);
+        resolve2(data);
       };
       devMiddleware(req, res, (err) => {
         if (err) {
           reject(err);
         } else {
-          resolve(void 0);
+          resolve2(void 0);
         }
       });
     });
@@ -1119,9 +1223,9 @@ async function compile(compiler) {
       await Promise.all(compilersWatching.map((watching) => pify(watching.close.bind(watching))()));
     });
     if (compiler.options.name === "client") {
-      return new Promise((resolve, reject) => {
+      return new Promise((resolve2, reject) => {
         compiler.hooks.done.tap("nuxt-dev", () => {
-          resolve(null);
+          resolve2(null);
         });
         compiler.hooks.failed.tap("nuxt-errorlog", (err) => {
           reject(err);
@@ -1133,17 +1237,17 @@ async function compile(compiler) {
         });
       });
     }
-    return new Promise((resolve, reject) => {
+    return new Promise((resolve2, reject) => {
       const watching = compiler.watch(nuxt.options.watchers.webpack, (err) => {
         if (err) {
           return reject(err);
         }
-        resolve(null);
+        resolve2(null);
       });
       compilersWatching.push(watching);
     });
   }
-  const stats = await new Promise((resolve, reject) => compiler.run((err, stats2) => err ? reject(err) : resolve(stats2)));
+  const stats = await new Promise((resolve2, reject) => compiler.run((err, stats2) => err ? reject(err) : resolve2(stats2)));
   if (stats.hasErrors()) {
     const error = new Error("Nuxt build error");
     error.stack = stats.toString("errors-only");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nuxt/webpack-builder",
-  "version": "3.17.3",
+  "version": "4.0.0-0",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/nuxt/nuxt.git",
@@ -38,6 +38,7 @@
     "fork-ts-checker-webpack-plugin": "^9.1.0",
     "h3": "^1.15.3",
     "jiti": "^2.4.2",
+    "knitwork": "^1.2.0",
     "magic-string": "^0.30.17",
     "memfs": "^4.17.1",
     "mini-css-extract-plugin": "^2.9.2",
@@ -52,27 +53,28 @@
     "pug-plain-loader": "^1.1.0",
     "std-env": "^3.9.0",
     "time-fix-plugin": "^2.0.7",
+    "tinyglobby": "^0.2.13",
     "ufo": "^1.6.1",
     "unenv": "^2.0.0-rc.15",
     "unplugin": "^2.3.3",
     "url-loader": "^4.1.1",
     "vue-bundle-renderer": "^2.1.1",
     "vue-loader": "^17.4.2",
-    "webpack": "^5.99.5",
+    "webpack": "^5.99.8",
     "webpack-bundle-analyzer": "^4.10.2",
     "webpack-dev-middleware": "^7.4.2",
     "webpack-hot-middleware": "^2.26.1",
     "webpackbar": "^7.0.0",
-    "@nuxt/kit": "3.17.3"
+    "@nuxt/kit": "4.0.0-0"
   },
   "devDependencies": {
     "@rspack/core": "1.3.9",
-    "@types/pify": "6.1.0",
     "@types/webpack-bundle-analyzer": "4.7.0",
     "@types/webpack-hot-middleware": "2.25.9",
+    "rollup": "4.40.2",
     "unbuild": "3.5.0",
     "vue": "3.5.13",
-    "@nuxt/schema": "3.17.3"
+    "@nuxt/schema": "4.0.0-0"
   },
   "peerDependencies": {
     "vue": "^3.3.4"