@lynx-js/template-webpack-plugin-canary 0.8.1-canary-20250627-a64333ef → 0.8.1-canary-20250627-a7e8b5bb

package/CHANGELOG.md

@@ -1,6 +1,6 @@
 # @lynx-js/template-webpack-plugin
 
-## 0.8.1-canary-20250627041429-a64333ef28228d6b90c32e027f67bef8acbd8432
+## 0.8.1-canary-20250627143427-a7e8b5bbbab0490e7cf6f47581130e7b32739abb
 
 ### Patch Changes
 
@@ -20,6 +20,34 @@
   }
   ```
 
+- Enable fine-grained control for `output.inlineScripts` ([#883](https://github.com/lynx-family/lynx-stack/pull/883))
+
+  ```ts
+  type InlineChunkTestFunction = (params: {
+    size: number;
+    name: string;
+  }) => boolean;
+
+  type InlineChunkTest = RegExp | InlineChunkTestFunction;
+
+  type InlineChunkConfig =
+    | boolean
+    | InlineChunkTest
+    | { enable?: boolean | "auto"; test: InlineChunkTest };
+  ```
+
+  ```ts
+  import { defineConfig } from "@lynx-js/rspeedy";
+
+  export default defineConfig({
+    output: {
+      inlineScripts: ({ name, size }) => {
+        return name.includes("foo") && size < 1000;
+      },
+    },
+  });
+  ```
+
 ## 0.8.0
 
 ### Minor Changes

package/lib/LynxEncodePlugin.d.ts

@@ -1,11 +1,20 @@
 import type { Compiler } from 'webpack';
+type InlineChunkTestFunction = (params: {
+    size: number;
+    name: string;
+}) => boolean;
+type InlineChunkTest = RegExp | InlineChunkTestFunction;
+type InlineChunkConfig = boolean | InlineChunkTest | {
+    enable?: boolean | 'auto';
+    test: InlineChunkTest;
+};
 /**
  * The options for LynxEncodePluginOptions
  *
  * @public
  */
 export interface LynxEncodePluginOptions {
-    inlineScripts?: boolean | undefined;
+    inlineScripts?: InlineChunkConfig | undefined;
 }
 /**
  * LynxEncodePlugin
@@ -63,3 +72,4 @@ export declare class LynxEncodePluginImpl {
 }
 export declare function isDebug(): boolean;
 export declare function isRsdoctor(): boolean;
+export {};

package/lib/LynxEncodePlugin.js

@@ -85,20 +85,30 @@ export class LynxEncodePluginImpl {
             }, async (args) => {
                 const { encodeData } = args;
                 const { manifest } = encodeData;
-                let publicPath = '/';
-                if (!this.options.inlineScripts) {
-                    if (typeof compilation?.outputOptions.publicPath === 'function') {
-                        compilation.errors.push(new compiler.webpack.WebpackError('`publicPath` as a function is not supported yet.'));
+                const [inlinedManifest, externalManifest] = Object.entries(manifest)
+                    .reduce(([inlined, external], [name, content]) => {
+                    const assert = compilation.getAsset(name);
+                    const shouldInline = this.#shouldInlineScript(name, assert.source.size());
+                    if (shouldInline) {
+                        inlined[name] = content;
                     }
                     else {
-                        publicPath = compilation?.outputOptions.publicPath ?? '/';
+                        external[name] = content;
                     }
+                    return [inlined, external];
+                }, [{}, {}]);
+                let publicPath = '/';
+                if (typeof compilation?.outputOptions.publicPath === 'function') {
+                    compilation.errors.push(new compiler.webpack.WebpackError('`publicPath` as a function is not supported yet.'));
+                }
+                else {
+                    publicPath = compilation?.outputOptions.publicPath ?? '/';
                 }
                 if (!isDebug() && !isDev && !isRsdoctor()) {
                     [
                         encodeData.lepusCode.root,
                         ...encodeData.lepusCode.chunks,
-                        ...Object.keys(manifest).map(name => ({ name })),
+                        ...Object.keys(inlinedManifest).map(name => ({ name })),
                         ...encodeData.css.chunks,
                     ]
                         .filter(asset => asset !== undefined)
@@ -113,26 +123,31 @@ export class LynxEncodePluginImpl {
                     //   '/app-service.js': `
                     //     lynx.requireModule('async-chunk1')
                     //     lynx.requireModule('async-chunk2')
-                    //     lynx.requireModule('initial-chunk1')
-                    //     lynx.requireModule('initial-chunk2')
+                    //     lynx.requireModule('inlined-initial-chunk1')
+                    //     lynx.requireModule('inlined-initial-chunk2')
+                    //     lynx.requireModuleAsync('external-initial-chunk1')
+                    //     lynx.requireModuleAsync('external-initial-chunk2')
                     //   `,
-                    //   'initial-chunk1': `<content-of-initial-chunk>`,
-                    //   'initial-chunk2': `<content-of-initial-chunk>`,
+                    //   'inlined-initial-chunk1': `<content>`,
+                    //   'inlined-initial-chunk2': `<content>`,
                     // },
                     // ```
                     '/app-service.js': [
                         this.#appServiceBanner(),
-                        Object.keys(manifest)
-                            .map((name) => `module.exports=lynx.requireModule('${this.#formatJSName(name, publicPath)}',globDynamicComponentEntry?globDynamicComponentEntry:'__Card__')`)
-                            .join(','),
+                        ...[externalManifest, inlinedManifest].flatMap(manifest => Object.keys(manifest).map(name => {
+                            if (manifest === externalManifest) {
+                                return `lynx.requireModuleAsync('${this.#formatJSName(name, publicPath)}')`;
+                            }
+                            else {
+                                return `module.exports=lynx.requireModule('${this.#formatJSName(name, '/')}',globDynamicComponentEntry?globDynamicComponentEntry:'__Card__')`;
+                            }
+                        }).join(',')),
                         this.#appServiceFooter(),
                     ].join(''),
-                    ...(this.options.inlineScripts
-                        ? Object.fromEntries(Object.entries(manifest).map(([name, source]) => [
-                            this.#formatJSName(name, publicPath),
-                            source,
-                        ]))
-                        : {}),
+                    ...Object.fromEntries(Object.entries(inlinedManifest).map(([name, content]) => [
+                        this.#formatJSName(name, '/'),
+                        content,
+                    ])),
                 };
                 return args;
             });
@@ -162,6 +177,24 @@ export class LynxEncodePluginImpl {
     #formatJSName(name, publicPath) {
         return publicPath + name;
     }
+    #shouldInlineScript(name, size) {
+        const inlineConfig = this.options.inlineScripts;
+        if (inlineConfig instanceof RegExp) {
+            return inlineConfig.test(name);
+        }
+        if (typeof inlineConfig === 'function') {
+            return inlineConfig({ size, name });
+        }
+        if (typeof inlineConfig === 'object') {
+            if (inlineConfig.enable === false)
+                return false;
+            if (inlineConfig.test instanceof RegExp) {
+                return inlineConfig.test.test(name);
+            }
+            return inlineConfig.test({ size, name });
+        }
+        return inlineConfig !== false;
+    }
     options;
 }
 export function isDebug() {

package/lib/LynxTemplatePlugin.d.ts

@@ -2,6 +2,10 @@ import { AsyncSeriesBailHook, AsyncSeriesWaterfallHook, SyncWaterfallHook } from
 import type { Asset, Compilation, Compiler } from 'webpack';
 import type * as CSS from '@lynx-js/css-serializer';
 import { cssChunksToMap } from './css/cssChunksToMap.js';
+export type OriginManifest = Record<string, {
+    content: string;
+    size: number;
+}>;
 /**
  * The options for encoding a Lynx bundle.
  *

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lynx-js/template-webpack-plugin-canary",
-  "version": "0.8.1-canary-20250627-a64333ef",
+  "version": "0.8.1-canary-20250627-a7e8b5bb",
   "description": "Simplifies creation of Lynx template files to serve your webpack bundles",
   "keywords": [
     "webpack",