@imtf/profile-scripts 2.0.0-beta.1 → 2.0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@imtf/profile-scripts",
-  "version": "2.0.0-beta.1",
+  "version": "2.0.0",
   "description": "Default scripts to bundle & transpile imtf front-end plugins",
   "main": "index.js",
   "bin": {
@@ -20,13 +20,12 @@
   "private": false,
   "dependencies": {
     "@originjs/vite-plugin-federation": "^1.4.1",
-    "@vitejs/plugin-react": "^5.1.4",
-    "esbuild": "^0.27.0",
+    "@vitejs/plugin-react": "^6.0.4",
+    "esbuild": "^0.28.1",
     "minimist": "^1.2.8",
-    "serve-handler": "^6.1.6",
-    "vite": "^7.3.1",
-    "vite-plugin-css-injected-by-js": "^4.0.1",
-    "vite-tsconfig-paths": "^6.0.1"
+    "serve-handler": "^6.1.7",
+    "vite": "^8.1.5",
+    "vite-plugin-css-injected-by-js": "^5.0.2"
   },
   "devDependencies": {
     "@types/minimist": "^1.2.5"

package/scripts/viteBuild.mjs

@@ -8,9 +8,8 @@ import react from "@vitejs/plugin-react";
 import { transform } from "esbuild";
 import minimist from "minimist";
 import handler from "serve-handler";
-import { build as viteBuild } from "vite";
+import { build as viteBuild, esmExternalRequirePlugin } from "vite";
 import cssInjectedByJsPlugin from "vite-plugin-css-injected-by-js";
-import tsconfigPaths from "vite-tsconfig-paths";
 
 import resolveEntryPoint from "./utils/resolveEntryPoint.mjs";
 import notifierPlugin from "./vitePlugins/viteNotifierPlugin.mjs";
@@ -21,7 +20,9 @@ const {
   entryPoint,
   externalGlobal,
   federation: enableFederation,
-} = minimist(process.argv.slice(2));
+} = /** @type {{ watch?: boolean; entryPoint?: string; externalGlobal?: string | string[]; federation?: boolean }} */ (
+  minimist(process.argv.slice(2))
+);
 
 const consumerRoot = process.cwd();
 const outDir = "build";
@@ -32,7 +33,7 @@ const entryAbs = resolveEntryPoint(entryPoint);
 const jsxPreTransformPlugin = {
   name: "jsx-pre-transform",
   enforce: "pre",
-  async transform(code, id) {
+  async transform(/** @type {string} */ code, /** @type {string} */ id) {
     if (id.endsWith(".js") && id.includes(path.resolve(consumerRoot, "src"))) {
       const result = await transform(code, {
         loader: "jsx",
@@ -54,7 +55,7 @@ const jsxPreTransformPlugin = {
 const packageJsonResolver = {
   name: "package-json-resolver",
   enforce: "pre",
-  resolveId(source) {
+  resolveId(/** @type {string} */ source) {
     if (!source.endsWith("/package.json")) return null;
 
     const pkgName = source.replace(/\/package\.json$/, "");
@@ -83,8 +84,8 @@ const externalGlobals = externalGlobal
       const [key, value] = curr.split("=");
       acc[key] = value;
       return acc;
-    }, {})
-  : {};
+    }, /** @type {Record<string, string>} */ ({}))
+  : /** @type {Record<string, string>} */ ({});
 
 // Dynamically resolve optional federation.config.(js|mjs) from consumer root
 const resolveFederationConfig = async () => {
@@ -95,7 +96,10 @@ const resolveFederationConfig = async () => {
   for (const file of candidates) {
     const fullPath = path.resolve(consumerRoot, file);
     if (fs.existsSync(fullPath)) {
-      const mod = await import(pathToFileURL(fullPath).href);
+      // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+      const mod = /** @type {Record<string, unknown>} */ (
+        await import(pathToFileURL(fullPath).href)
+      );
       return mod.default ?? mod;
     }
   }
@@ -120,9 +124,6 @@ const vitePlugins = [
     include: /\.(js|jsx|ts|tsx)$/,
   }),
 
-  // Resolve tsconfig path aliases
-  tsconfigPaths(),
-
   // Inject CSS into the bundle for library consumers without needing separate CSS files
   cssInjectedByJsPlugin(),
 
@@ -137,6 +138,17 @@ const vitePlugins = [
 if (enableFederation) {
   const federationConfig = await resolveFederationConfig();
   vitePlugins.push(federation(federationConfig));
+  // Vite 8 (rolldown) disables codeSplitting for iife format, making manualChunks invalid.
+  // Since this is a consumer-only federation setup, manualChunks is not needed.
+  vitePlugins.push({
+    name: "remove-manual-chunks-for-iife",
+    enforce: "post",
+    outputOptions(opts) {
+      // eslint-disable-next-line @typescript-eslint/no-deprecated
+      delete opts.manualChunks;
+      return opts;
+    },
+  });
 }
 
 /**
@@ -155,17 +167,25 @@ const viteConfig = {
     chunkSizeWarningLimit: 3000,
     rollupOptions: {
       input: entryAbs,
-      external: [
-        "react",
-        "react-dom",
-        "react-router-dom",
-        "IMTFPlugins",
-        ...Object.keys(externalGlobals),
+      // Fixes Vite 8+ (rolldown) leaving a literal require("react") for nested CJS deps
+      // in 'iife' output (rolldown/rolldown#8349). Don't also list these in a top-level
+      // 'external' option - that silently disables this plugin's require() rewrite for
+      // the duplicated entries.
+      plugins: [
+        esmExternalRequirePlugin({
+          external: [
+            "react",
+            "react-dom",
+            "react-router-dom",
+            "IMTFPlugins",
+            ...Object.keys(externalGlobals),
+          ],
+        }),
       ],
       output: {
         entryFileNames: "index.js",
         format: "iife",
-        inlineDynamicImports: false,
+        // inlineDynamicImports: false,
         globals: {
           react: "React",
           "react-dom": "ReactDOM",
@@ -178,6 +198,9 @@ const viteConfig = {
     minify: watch ? false : process.env.IMTF_MINIFY_WEBAPP !== "false",
     watch: watch ? {} : null,
   },
+  define: {
+    "import.meta": "{}",
+  },
 };
 
 // Run Vite build in either watch or build mode
@@ -185,6 +208,7 @@ if (watch) {
   await viteBuild(viteConfig);
 
   http
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-return
     .createServer((...params) => handler(...params, { public: outDir }))
     .listen(3010, () => {
       // eslint-disable-next-line no-console

package/scripts/vitePlugins/viteNotifierPlugin.mjs

@@ -1,3 +1,5 @@
+/* eslint-disable no-console */
+
 /**
  * Logs Vite build and rebuild status with rebuild count.
  * Distinguishes initial build vs subsequent rebuilds in watch mode.

package/scripts/vitePlugins/viteSvgPlugin.mjs

@@ -1,10 +1,15 @@
+import fs from "node:fs";
+import path from "path";
+
+import { transform } from "@svgr/core";
+
 /**
  * Vite plugin to transform SVG imports based on project conventions.
  *
  * - SVGs outside `src/` or inside `src/assets/` are converted to base64 data URLs
  * - SVGs inside `src/` are transformed into React components using SVGR
  *
- * @param {Object} [options] - SVGR configuration options
+ * @param {Record<string, unknown>} [options] - SVGR configuration options
  * @returns {import('vite').Plugin}
  */
 const viteSvgPlugin = (options = {}) => {
@@ -31,7 +36,7 @@ const viteSvgPlugin = (options = {}) => {
         const dataurl = `data:image/svg+xml;base64,${Buffer.from(svg).toString("base64")}`;
         return {
           code: `export default ${JSON.stringify(dataurl)};`,
-          map: null
+          map: null,
         };
       }
 
@@ -40,17 +45,17 @@ const viteSvgPlugin = (options = {}) => {
         svg,
         {
           plugins: ["@svgr/plugin-svgo", "@svgr/plugin-jsx"],
-          ...options
+          ...options,
         },
-        { filePath: svgPath }
+        { filePath: svgPath },
       );
 
       return {
         code: contents,
-        map: null
+        map: null,
       };
-    }
+    },
   };
-}
+};
 
 export default viteSvgPlugin;