feat(pack-up): add the ability to pass plugins via the config (#18486)

* feat(pack-up): add the ability to pass plugins via the config

* refactor: make plugins a func or array

docs/docs/docs/05-utils/pack-up/02-config.mdx

@@ -48,7 +48,13 @@ interface Config {
    */
   minify?: boolean;
   /**
-   * Instead of creating as few chunks as possible, this mode
+   * An array of Vite plugins to use when bundling.
+   */
+  plugins?: PluginOption[] | (({ runtime }: { runtime: Runtime }) => PluginOption[]);
+  /**
+   * @alpha
+   *
+   * @description Instead of creating as few chunks as possible, this mode
    * will create separate chunks for all modules using the original module
    * names as file names
    */
@@ -63,7 +69,7 @@ interface Config {
    */
   runtime?: Runtime;
   /**
-   * path to the tsconfig file to use for the bundle.
+   * Path to the tsconfig file to use for the bundle.
    */
   tsconfig?: string;
 }

packages/utils/pack-up/README.md

@@ -128,6 +128,18 @@ An array of modules that should not be bundled but instead be resolved at runtim
 
 Whether to minify the output or not.
 
+#### `plugins`
+
+- Type: `PluginOption[] | (({ runtime }: { runtime: Runtime }) => PluginOption[]);`
+
+An array of Vite plugins to use when bundling, or optionally a function that returns an array of plugins based on the runtime.
+
+#### `preserveModules`
+
+- Type: `boolean`
+
+Instead of creating as few chunks as possible, this mode will create separate chunks for all modules using the original module names as file names.
+
 #### `sourcemap`
 
 - Type: `boolean`
@@ -139,3 +151,9 @@ Whether to generate sourcemaps for the output or not.
 - Type: `Runtime`
 
 The transpilation target of the bundle. This is useful if you're bundling many different CLIs or Node.js workers and you want them to be transpiled for the node environment.
+
+#### `tsconfig`
+
+- Type: `string`
+
+Path to the tsconfig file to use for the bundle, defaults to `tsconfig.build.json`.

packages/utils/pack-up/src/node/core/config.ts

@@ -8,6 +8,7 @@ import { Logger } from './logger';
 
 import type { Export } from './exports';
 import type { Runtime } from '../createBuildContext';
+import type { PluginOption } from 'vite';
 
 interface LoadConfigOptions {
   cwd: string;
@@ -90,6 +91,7 @@ interface ConfigOptions {
    */
   externals?: string[];
   minify?: boolean;
+  plugins?: PluginOption[] | (({ runtime }: { runtime: Runtime }) => PluginOption[]);
   /**
    * @alpha
    *

packages/utils/pack-up/src/node/tasks/vite/config.ts

@@ -1,3 +1,4 @@
+/* eslint-disable no-nested-ternary */
 import react from '@vitejs/plugin-react';
 import { builtinModules } from 'node:module';
 import path from 'path';
@@ -26,6 +27,14 @@ const resolveViteConfig = (ctx: BuildContext, task: ViteBaseTask) => {
   const exportIds = Object.keys(exportMap).map((exportPath) => path.join(pkg.name, exportPath));
   const sourcePaths = Object.values(exportMap).map((exp) => path.resolve(cwd, exp.source));
 
+  const basePlugins = runtime === 'node' ? [] : [react()];
+
+  const plugins = ctx.config.plugins
+    ? typeof ctx.config.plugins === 'function'
+      ? ctx.config.plugins({ runtime })
+      : ctx.config.plugins
+    : [];
+
   const config = {
     configFile: false,
     root: cwd,
@@ -120,14 +129,7 @@ const resolveViteConfig = (ctx: BuildContext, task: ViteBaseTask) => {
         },
       },
     },
-    /**
-     * We _could_ omit this, but we'd need to introduce the
-     * concept of a custom config for the scripts straight away
-     *
-     * and since this is isolated to the Strapi CLI, we can make
-     * some assumptions and add some weight until we move it outside.
-     */
-    plugins: runtime === 'node' ? [] : [react()],
+    plugins: [...basePlugins, ...plugins],
   } satisfies InlineConfig;
 
   return config;