@taro-minify-pack/plugin-async-pack 0.0.1-alpha.0

package/.eslintrc.js

@@ -0,0 +1,21 @@
+module.exports = {
+  env: {
+    node: true,
+    es6: true
+  },
+  extends: [
+    'standard',
+    'plugin:@typescript-eslint/recommended'
+  ],
+  parser: '@typescript-eslint/parser',
+  plugins: ['@typescript-eslint'],
+  rules: {
+    '@typescript-eslint/no-empty-function': 'off',
+    '@typescript-eslint/no-explicit-any': 'off',
+    '@typescript-eslint/no-var-requires': 'off',
+    '@typescript-eslint/no-non-null-assertion': 'off',
+    '@typescript-eslint/ban-ts-comment': 'off',
+    '@typescript-eslint/no-unused-vars': 'off',
+    'no-use-before-define': 'off'
+  }
+}

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 yu.pan
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/index.d.ts

@@ -0,0 +1,5 @@
+import type { IPluginContext } from '@tarojs/service';
+import { AsyncPackOpts } from './types';
+export { AsyncPackOpts } from './types';
+declare const _default: (ctx: IPluginContext, pluginOpts: AsyncPackOpts) => void;
+export default _default;

package/dist/index.js

@@ -0,0 +1,75 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const webpack_sources_1 = require("webpack-sources");
+const transform_webpack_runtime_1 = require("./transform-webpack-runtime");
+const transform_before_compression_plugin_1 = require("./transform-before-compression-plugin");
+const merge_output_1 = require("./merge-output");
+const transform_app_stylesheet_1 = require("./transform-app-stylesheet");
+const fs_1 = __importDefault(require("fs"));
+const path_1 = __importDefault(require("path"));
+const dynamicPackOptsDefaultOpt = {
+    dynamicModuleJsDir: 'dynamic-common',
+    dynamicModuleStyleFile: 'dynamic-common'
+};
+exports.default = (ctx, pluginOpts) => {
+    const finalOpts = Object.assign(Object.assign({}, dynamicPackOptsDefaultOpt), pluginOpts);
+    if (process.env.TARO_ENV !== 'weapp')
+        return;
+    ctx.modifyWebpackChain(({ chain }) => {
+        // 动态获取现有的 splitChunks 配置
+        const existingSplitChunks = chain.optimization.get('splitChunks') || {};
+        const { common, vendors } = existingSplitChunks.cacheGroups;
+        const newCommonChunks = common ? Object.assign(Object.assign({}, common), { chunks: 'initial' }) : common;
+        const newVendorsChunks = vendors ? Object.assign(Object.assign({}, vendors), { chunks: 'initial' }) : vendors;
+        chain.optimization.merge({
+            splitChunks: Object.assign(Object.assign({}, existingSplitChunks), { cacheGroups: Object.assign(Object.assign({}, existingSplitChunks.cacheGroups), { common: newCommonChunks, vendors: newVendorsChunks }) })
+        });
+        chain.merge({
+            output: {
+                chunkFilename: `${finalOpts.dynamicModuleJsDir}/[chunkhash].js`, // 异步模块输出路径
+                path: ctx.paths.outputPath,
+                clean: true
+            }
+        });
+        chain.plugin('miniCssExtractPlugin')
+            .tap((args) => {
+            const [options] = args;
+            const finalOption = Object.assign(Object.assign({}, options), { chunkFilename: `${finalOpts.dynamicModuleStyleFile}/[chunkhash].wxss` });
+            return [finalOption];
+        });
+        chain.plugin(transform_before_compression_plugin_1.PLUGIN_NAME).use(transform_before_compression_plugin_1.TransformBeforeCompressionPlugin, [{
+                test: /^(runtime\.js|app\.wxss)$/,
+                transform: (opt) => {
+                    const { source, assetName, assets } = opt;
+                    const transformOpts = Object.assign(Object.assign({}, finalOpts), { assets });
+                    if (/^app\.wxss$/.test(assetName))
+                        return (0, transform_app_stylesheet_1.transformAppStylesheet)(source, transformOpts);
+                    if (/^runtime\.js$/.test(assetName))
+                        return (0, transform_webpack_runtime_1.transformWebpackRuntime)(source, transformOpts);
+                    return source;
+                }
+            }]);
+        chain.plugin(merge_output_1.PLUGIN_NAME).use(merge_output_1.MergeOutputPlugin, [{
+                test: new RegExp(`^${finalOpts.dynamicModuleStyleFile}\\/.*\\.wxss$`),
+                outputFile: `${finalOpts.dynamicModuleStyleFile}.wxss`
+            }]);
+    });
+    ctx.modifyBuildAssets(({ assets }) => {
+        const curAppJSON = assets['app.json'];
+        if (!curAppJSON)
+            return;
+        const curAppJSONContent = JSON.parse(curAppJSON.source());
+        const dynamicPackagesConfig = { root: finalOpts.dynamicModuleJsDir, pages: [] };
+        const hasDynamicModule = (() => {
+            const isDynamicModuleDirExist = fs_1.default.existsSync(path_1.default.join(ctx.paths.outputPath, finalOpts.dynamicModuleJsDir));
+            return isDynamicModuleDirExist && fs_1.default.readdirSync(path_1.default.join(ctx.paths.outputPath, finalOpts.dynamicModuleJsDir)).length > 0;
+        })();
+        const { resolveAlias = {}, subpackages = [] } = curAppJSONContent;
+        const newAppJSONContent = Object.assign(Object.assign({}, curAppJSONContent), { subpackages: hasDynamicModule ? [...subpackages, dynamicPackagesConfig] : subpackages, resolveAlias: Object.assign(Object.assign({}, resolveAlias), { [`${finalOpts.dynamicModuleJsDir}/*`]: `/${finalOpts.dynamicModuleJsDir}/*` }) });
+        assets['app.json'] = new webpack_sources_1.RawSource(JSON.stringify(newAppJSONContent, null, 2));
+    });
+};
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/dist/merge-output.d.ts

@@ -0,0 +1,12 @@
+import { Compiler } from 'webpack';
+export declare const PLUGIN_NAME = "MergeOutput";
+interface MergeOutputOpt {
+    test: RegExp;
+    outputFile: string;
+}
+export declare class MergeOutputPlugin {
+    private readonly opts;
+    constructor(opts: MergeOutputOpt);
+    apply(compiler: Compiler): void;
+}
+export {};

package/dist/merge-output.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MergeOutputPlugin = exports.PLUGIN_NAME = void 0;
+exports.PLUGIN_NAME = 'MergeOutput';
+class MergeOutputPlugin {
+    constructor(opts) {
+        this.opts = opts;
+    }
+    apply(compiler) {
+        compiler.hooks.compilation.tap(exports.PLUGIN_NAME, (compilation) => {
+            const stage = compiler.webpack.Compilation.PROCESS_ASSETS_STAGE_ADDITIONAL; // 最早阶段，在优化前
+            compilation.hooks.processAssets.tap({ name: exports.PLUGIN_NAME, stage }, (assets) => {
+                const mergedResult = Object.keys(assets).reduce((result, item) => {
+                    if (!this.opts.test.test(item))
+                        return result;
+                    const code = assets[item].source().toString();
+                    delete assets[item];
+                    return result + code + '\n';
+                }, '');
+                compilation.assets[this.opts.outputFile] = new compiler.webpack.sources.RawSource(mergedResult);
+            });
+        });
+    }
+}
+exports.MergeOutputPlugin = MergeOutputPlugin;
+//# sourceMappingURL=merge-output.js.map

package/dist/merge-output.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"merge-output.js","sourceRoot":"","sources":["../src/merge-output.ts"],"names":[],"mappings":";;;AAEa,QAAA,WAAW,GAAG,aAAa,CAAA;AAOxC,MAAa,iBAAiB;IAG5B,YAAa,IAAoB;QAC/B,IAAI,CAAC,IAAI,GAAG,IAAI,CAAA;IAClB,CAAC;IAED,KAAK,CAAE,QAAkB;QACvB,QAAQ,CAAC,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,mBAAW,EAAE,CAAC,WAAwB,EAAE,EAAE;YACvE,MAAM,KAAK,GAAG,QAAQ,CAAC,OAAO,CAAC,WAAW,CAAC,+BAA+B,CAAA,CAAC,YAAY;YAEvF,WAAW,CAAC,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,EAAE,IAAI,EAAE,mBAAW,EAAE,KAAK,EAAE,EAAE,CAAC,MAAM,EAAE,EAAE;gBAC3E,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC,MAAM,EAAE,IAAI,EAAE,EAAE;oBAC/D,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;wBAAE,OAAO,MAAM,CAAA;oBAC7C,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,CAAC,QAAQ,EAAE,CAAA;oBAC7C,OAAO,MAAM,CAAC,IAAI,CAAC,CAAA;oBACnB,OAAO,MAAM,GAAG,IAAI,GAAG,IAAI,CAAA;gBAC7B,CAAC,EAAE,EAAE,CAAC,CAAA;gBAEN,WAAW,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,UAAW,CAAC,GAAG,IAAI,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,YAAY,CAAC,CAAA;YAClG,CAAC,CAAC,CAAA;QACJ,CAAC,CAAC,CAAA;IACJ,CAAC;CACF;AAvBD,8CAuBC"}

package/dist/transform-app-stylesheet.d.ts

@@ -0,0 +1,6 @@
+import type { CompilationAssets, AsyncPackOpts } from './types';
+interface Opts extends AsyncPackOpts {
+    assets: CompilationAssets;
+}
+export declare const transformAppStylesheet: (code: string, opts: Opts) => string;
+export {};

package/dist/transform-app-stylesheet.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.transformAppStylesheet = void 0;
+const transformAppStylesheet = (code, opts) => {
+    const { dynamicModuleStyleFile, assets } = opts;
+    const isDynamicModuleStyleFileExist = Object.keys(assets).some(assetName => {
+        return new RegExp(`${dynamicModuleStyleFile}\\.wxss`).test(assetName);
+    });
+    if (!isDynamicModuleStyleFileExist)
+        return code;
+    return code.concat(`@import './${dynamicModuleStyleFile}.wxss';`);
+};
+exports.transformAppStylesheet = transformAppStylesheet;
+//# sourceMappingURL=transform-app-stylesheet.js.map

package/dist/transform-app-stylesheet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"transform-app-stylesheet.js","sourceRoot":"","sources":["../src/transform-app-stylesheet.ts"],"names":[],"mappings":";;;AAMO,MAAM,sBAAsB,GAAG,CAAC,IAAY,EAAE,IAAU,EAAE,EAAE;IACjE,MAAM,EAAE,sBAAsB,EAAE,MAAM,EAAE,GAAG,IAAI,CAAA;IAE/C,MAAM,6BAA6B,GAAG,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,EAAE;QACzE,OAAO,IAAI,MAAM,CAAC,GAAG,sBAAsB,SAAS,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;IACvE,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,6BAA6B;QAAE,OAAO,IAAI,CAAA;IAE/C,OAAO,IAAI,CAAC,MAAM,CAAC,cAAc,sBAAsB,SAAS,CAAC,CAAA;AACnE,CAAC,CAAA;AAVY,QAAA,sBAAsB,0BAUlC"}

package/dist/transform-before-compression-plugin.d.ts

@@ -0,0 +1,17 @@
+import webpack from 'webpack';
+import { CompilationAssets } from './types';
+export interface TransformOpt {
+    assetName: string;
+    source: string | Buffer;
+    assets: CompilationAssets;
+}
+export interface PluginOpt {
+    test?: RegExp;
+    transform: (opt: TransformOpt) => string;
+}
+export declare const PLUGIN_NAME = "TransformBeforeCompression";
+export declare class TransformBeforeCompressionPlugin {
+    private readonly opt;
+    constructor(opt: PluginOpt);
+    apply(compiler: webpack.Compiler): void;
+}

package/dist/transform-before-compression-plugin.js

@@ -0,0 +1,31 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TransformBeforeCompressionPlugin = exports.PLUGIN_NAME = void 0;
+const webpack_1 = __importDefault(require("webpack"));
+exports.PLUGIN_NAME = 'TransformBeforeCompression';
+class TransformBeforeCompressionPlugin {
+    constructor(opt) {
+        this.opt = opt;
+    }
+    apply(compiler) {
+        compiler.hooks.compilation.tap(exports.PLUGIN_NAME, (compilation) => {
+            const stage = webpack_1.default.Compilation.PROCESS_ASSETS_STAGE_OPTIMIZE; // 压缩前
+            compilation.hooks.processAssets.tap({ name: exports.PLUGIN_NAME, stage }, (assets) => {
+                const { test, transform } = this.opt;
+                const assetNames = Object.keys(assets);
+                assetNames.forEach((assetName) => {
+                    if (!test || !test.test(assetName))
+                        return;
+                    const source = assets[assetName].source();
+                    const transformResult = transform({ assetName, source, assets });
+                    compilation.updateAsset(assetName, new webpack_1.default.sources.RawSource(transformResult));
+                });
+            });
+        });
+    }
+}
+exports.TransformBeforeCompressionPlugin = TransformBeforeCompressionPlugin;
+//# sourceMappingURL=transform-before-compression-plugin.js.map

package/dist/transform-before-compression-plugin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"transform-before-compression-plugin.js","sourceRoot":"","sources":["../src/transform-before-compression-plugin.ts"],"names":[],"mappings":";;;;;;AAAA,sDAA6B;AAchB,QAAA,WAAW,GAAG,4BAA4B,CAAA;AAEvD,MAAa,gCAAgC;IAG3C,YAAa,GAAc;QACzB,IAAI,CAAC,GAAG,GAAG,GAAG,CAAA;IAChB,CAAC;IAED,KAAK,CAAE,QAA0B;QAC/B,QAAQ,CAAC,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,mBAAW,EAAE,CAAC,WAAgC,EAAE,EAAE;YAC/E,MAAM,KAAK,GAAG,iBAAO,CAAC,WAAW,CAAC,6BAA6B,CAAA,CAAC,MAAM;YAEtE,WAAW,CAAC,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,EAAE,IAAI,EAAE,mBAAW,EAAE,KAAK,EAAE,EAAE,CAAC,MAAM,EAAE,EAAE;gBAC3E,MAAM,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,GAAG,CAAA;gBAEpC,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;gBAEtC,UAAU,CAAC,OAAO,CAAC,CAAC,SAAS,EAAE,EAAE;oBAC/B,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC;wBAAE,OAAM;oBAE1C,MAAM,MAAM,GAAG,MAAM,CAAC,SAAS,CAAC,CAAC,MAAM,EAAE,CAAA;oBAEzC,MAAM,eAAe,GAAG,SAAS,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAkB,CAAC,CAAA;oBAEhF,WAAW,CAAC,WAAW,CAAC,SAAS,EAAE,IAAI,iBAAO,CAAC,OAAO,CAAC,SAAS,CAAC,eAAe,CAAC,CAAC,CAAA;gBACpF,CAAC,CAAC,CAAA;YACJ,CAAC,CAAC,CAAA;QACJ,CAAC,CAAC,CAAA;IACJ,CAAC;CACF;AA5BD,4EA4BC"}

package/dist/transform-webpack-runtime.d.ts

@@ -0,0 +1,6 @@
+import type { CompilationAssets, AsyncPackOpts } from './types';
+interface Opts extends AsyncPackOpts {
+    assets: CompilationAssets;
+}
+export declare const transformWebpackRuntime: (code: string, opts: Opts) => string;
+export {};

package/dist/transform-webpack-runtime.js

@@ -0,0 +1,160 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.transformWebpackRuntime = void 0;
+const core_1 = require("@babel/core");
+const generator_1 = __importDefault(require("@babel/generator"));
+const parser = __importStar(require("@babel/parser"));
+const traverse_1 = __importDefault(require("@babel/traverse"));
+const types = __importStar(require("@babel/types"));
+const webpackLoadDynamicModuleTemplateDep = `
+  var loadedDynamicModules = {};
+  var loadDynamicModule = function (dynamicModulePath) {
+    var loadDynamicModuleFn = loadDynamicModuleFnMap[dynamicModulePath];
+    return loadDynamicModuleFn ? loadDynamicModuleFn() : Promise.reject();
+  };
+  var promiseRetry = function (apply,retries = 6,delay = 500) {
+    return apply().catch(function (error) {
+      if (retries <= 0) return Promise.reject(error);
+      return new Promise(function (resolve) {
+          setTimeout(resolve, delay);
+       })
+       .then(function () {
+          return promiseRetry(apply, retries - 1, delay)
+       });
+    })
+  }
+`;
+const webpackLoadDynamicModuleTemplate = `
+  __webpack_require__.l = function (dynamicModulePath, done, key, chunkId) {
+    if (inProgress[dynamicModulePath]) {
+      inProgress[dynamicModulePath].push(done);
+      return;
+    }
+
+    const target = { src: dynamicModulePath };
+
+    if (loadedDynamicModules[dynamicModulePath]) return done({ type: 'loaded', target });
+
+    promiseRetry(function () {
+      return loadDynamicModule(dynamicModulePath)
+    })
+    .then(function () {
+      return done({ type: 'loaded', target })
+    }).catch(function () {
+      return done({ type:'error', target })
+    });
+  };
+`;
+const replaceWebpackLoadScriptFn = (assignmentExpressionNodePath, opts) => {
+    const { left, right } = assignmentExpressionNodePath.node || {};
+    if (!types.isMemberExpression(left))
+        return;
+    if (!types.isFunctionExpression(right))
+        return;
+    if (!types.isIdentifier(left.object, { name: '__webpack_require__' }))
+        return;
+    if (!types.isIdentifier(left.property, { name: 'l' }))
+        return;
+    const isProcessed = right.params.some((item) => {
+        return types.isIdentifier(item, { name: 'dynamicModulePath' });
+    });
+    if (isProcessed)
+        return;
+    const { assets, dynamicModuleJsDir } = opts;
+    const dynamicAssets = Object.keys(assets).filter((assetName) => {
+        return new RegExp(`^${dynamicModuleJsDir}/.`).test(assetName);
+    });
+    const loadDynamicModuleFnMapCode = (() => {
+        const tempCode = dynamicAssets.map((dynamicAsset) => {
+            return `'/${dynamicAsset}':function (){ return require.async('${dynamicAsset}'); }`;
+        });
+        return `var loadDynamicModuleFnMap = {${tempCode.join(',')}}`;
+    })();
+    const templateCodeAst = core_1.template.ast(webpackLoadDynamicModuleTemplate);
+    const templateCodeDepAst = core_1.template.ast(webpackLoadDynamicModuleTemplateDep);
+    const loadDynamicModuleFnMapAst = core_1.template.ast(loadDynamicModuleFnMapCode);
+    assignmentExpressionNodePath.replaceWith(templateCodeAst);
+    assignmentExpressionNodePath.insertBefore(templateCodeDepAst);
+    assignmentExpressionNodePath.insertBefore(loadDynamicModuleFnMapAst);
+};
+const webpackLoadDynamicModuleStylesheetTemplate = `
+loadStylesheet = function () {
+  return Promise.resolve()
+}
+`;
+const replaceLoadStylesheetFn = (nodePath) => {
+    const { id, init } = nodePath.node || {};
+    if (!types.isIdentifier(id, { name: 'loadStylesheet' }))
+        return;
+    if (!types.isFunctionExpression(init))
+        return;
+    const isProcessed = !init.params.length;
+    if (isProcessed)
+        return;
+    const templateCodeAst = core_1.template.expression(webpackLoadDynamicModuleStylesheetTemplate)();
+    nodePath.replaceWith(templateCodeAst);
+};
+const removeCreateStylesheetFn = (nodePath) => {
+    const { id } = nodePath.node || {};
+    if (!types.isIdentifier(id, { name: 'createStylesheet' }))
+        return;
+    nodePath.remove();
+};
+const removeFindStylesheetFn = (nodePath) => {
+    const { id } = nodePath.node || {};
+    if (!types.isIdentifier(id, { name: 'findStylesheet' }))
+        return;
+    nodePath.remove();
+};
+const transformWebpackRuntime = (code, opts) => {
+    const ast = parser.parse(code); // 将代码解析为 AST
+    (0, traverse_1.default)(ast, {
+        AssignmentExpression: (nodePath) => {
+            replaceWebpackLoadScriptFn(nodePath, opts);
+        },
+        VariableDeclarator(nodePath) {
+            replaceLoadStylesheetFn(nodePath);
+            removeCreateStylesheetFn(nodePath);
+            removeFindStylesheetFn(nodePath);
+        }
+    });
+    return (0, generator_1.default)(ast).code;
+};
+exports.transformWebpackRuntime = transformWebpackRuntime;
+//# sourceMappingURL=transform-webpack-runtime.js.map

package/dist/transform-webpack-runtime.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"transform-webpack-runtime.js","sourceRoot":"","sources":["../src/transform-webpack-runtime.ts"],"names":[],"mappings":"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"}

package/dist/types.d.ts

@@ -0,0 +1,6 @@
+import { Source } from 'webpack-sources';
+export interface AsyncPackOpts {
+    dynamicModuleJsDir: string;
+    dynamicModuleStyleFile: string;
+}
+export type CompilationAssets = Record<string, Source>;

package/dist/types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=types.js.map

package/dist/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":""}

package/package.json

@@ -0,0 +1,51 @@
+{
+  "name": "@taro-minify-pack/plugin-async-pack",
+  "version": "0.0.1-alpha.0",
+  "description": "",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "homepage": "https://github.com/panyu97py/taro-minify-pack",
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/panyu97py/taro-minify-pack.git"
+  },
+  "author": "yu.pan",
+  "license": "ISC",
+  "peerDependencies": {
+    "@tarojs/service": "^3.0.0"
+  },
+  "dependencies": {
+    "@babel/core": "^7.26.10",
+    "@babel/generator": "^7.26.10",
+    "@babel/parser": "^7.26.10",
+    "@babel/template": "^7.26.9",
+    "@babel/traverse": "^7.26.10",
+    "@babel/types": "^7.26.10",
+    "webpack": "^5.98.0",
+    "webpack-sources": "^3.2.3"
+  },
+  "devDependencies": {
+    "@tarojs/service": "^4.0.9",
+    "@types/babel__core": "^7.20.5",
+    "@types/babel__generator": "^7.6.8",
+    "@types/babel__template": "^7.4.4",
+    "@types/babel__traverse": "^7.20.6",
+    "@types/md5": "^2.3.5",
+    "@types/node": "^18.19.130",
+    "@types/webpack-sources": "^3.2.3",
+    "@typescript-eslint/eslint-plugin": "^8.26.1",
+    "@typescript-eslint/parser": "^8.26.1",
+    "eslint": "^8.19.0",
+    "eslint-config-standard": "^17.0.0",
+    "eslint-plugin-import": "^2.26.0",
+    "eslint-plugin-n": "^15.2.3",
+    "eslint-plugin-promise": "^6.0.0",
+    "typescript": "^5.8.2"
+  },
+  "scripts": {
+    "build": "tsc"
+  }
+}

package/src/index.ts

@@ -0,0 +1,107 @@
+import type { IPluginContext } from '@tarojs/service'
+import { RawSource } from 'webpack-sources'
+import { transformWebpackRuntime } from './transform-webpack-runtime'
+import {
+  TransformOpt,
+  TransformBeforeCompressionPlugin,
+  PLUGIN_NAME as TransformBeforeCompressionPluginName
+} from './transform-before-compression-plugin'
+import { MergeOutputPlugin, PLUGIN_NAME as MergeOutputPluginName } from './merge-output'
+import { AsyncPackOpts } from './types'
+import { transformAppStylesheet } from './transform-app-stylesheet'
+import fs from 'fs'
+import path from 'path'
+
+export { AsyncPackOpts } from './types'
+
+const dynamicPackOptsDefaultOpt: AsyncPackOpts = {
+  dynamicModuleJsDir: 'dynamic-common',
+  dynamicModuleStyleFile: 'dynamic-common'
+}
+
+export default (ctx: IPluginContext, pluginOpts: AsyncPackOpts) => {
+  const finalOpts = { ...dynamicPackOptsDefaultOpt, ...pluginOpts }
+
+  if (process.env.TARO_ENV !== 'weapp') return
+
+  ctx.modifyWebpackChain(({ chain }) => {
+    // 动态获取现有的 splitChunks 配置
+    const existingSplitChunks = chain.optimization.get('splitChunks') || {}
+
+    const { common, vendors } = existingSplitChunks.cacheGroups
+
+    const newCommonChunks = common ? { ...common, chunks: 'initial' } : common
+
+    const newVendorsChunks = vendors ? { ...vendors, chunks: 'initial' } : vendors
+
+    chain.optimization.merge({
+      splitChunks: {
+        ...existingSplitChunks,
+        cacheGroups: {
+          ...existingSplitChunks.cacheGroups,
+          common: newCommonChunks,
+          vendors: newVendorsChunks
+        }
+      }
+    })
+
+    chain.merge({
+      output: {
+        chunkFilename: `${finalOpts.dynamicModuleJsDir}/[chunkhash].js`, // 异步模块输出路径
+        path: ctx.paths.outputPath,
+        clean: true
+      }
+    })
+
+    chain.plugin('miniCssExtractPlugin')
+      .tap((args) => {
+        const [options] = args
+        const finalOption = { ...options, chunkFilename: `${finalOpts.dynamicModuleStyleFile}/[chunkhash].wxss` }
+        return [finalOption]
+      })
+
+    chain.plugin(TransformBeforeCompressionPluginName).use(TransformBeforeCompressionPlugin, [{
+      test: /^(runtime\.js|app\.wxss)$/,
+      transform: (opt: TransformOpt) => {
+        const { source, assetName, assets } = opt
+        const transformOpts = { ...finalOpts, assets }
+        if (/^app\.wxss$/.test(assetName)) return transformAppStylesheet(source as string, transformOpts)
+        if (/^runtime\.js$/.test(assetName)) return transformWebpackRuntime(source as string, transformOpts)
+        return source as string
+      }
+    }])
+
+    chain.plugin(MergeOutputPluginName).use(MergeOutputPlugin, [{
+      test: new RegExp(`^${finalOpts.dynamicModuleStyleFile}\\/.*\\.wxss$`),
+      outputFile: `${finalOpts.dynamicModuleStyleFile}.wxss`
+    }])
+  })
+
+  ctx.modifyBuildAssets(({ assets }) => {
+    const curAppJSON = assets['app.json']
+
+    if (!curAppJSON) return
+
+    const curAppJSONContent = JSON.parse(curAppJSON.source())
+
+    const dynamicPackagesConfig = { root: finalOpts.dynamicModuleJsDir, pages: [] }
+
+    const hasDynamicModule = (() => {
+      const isDynamicModuleDirExist = fs.existsSync(path.join(ctx.paths.outputPath, finalOpts.dynamicModuleJsDir))
+      return isDynamicModuleDirExist && fs.readdirSync(path.join(ctx.paths.outputPath, finalOpts.dynamicModuleJsDir)).length > 0
+    })()
+
+    const { resolveAlias = {}, subpackages = [] } = curAppJSONContent
+
+    const newAppJSONContent = {
+      ...curAppJSONContent,
+      subpackages: hasDynamicModule ? [...subpackages, dynamicPackagesConfig] : subpackages,
+      resolveAlias: {
+        ...resolveAlias,
+        [`${finalOpts.dynamicModuleJsDir}/*`]: `/${finalOpts.dynamicModuleJsDir}/*`
+      }
+    }
+
+    assets['app.json'] = new RawSource(JSON.stringify(newAppJSONContent, null, 2))
+  })
+}

package/src/merge-output.ts

@@ -0,0 +1,33 @@
+import { Compiler, Compilation } from 'webpack'
+
+export const PLUGIN_NAME = 'MergeOutput'
+
+interface MergeOutputOpt {
+    test: RegExp,
+    outputFile: string,
+}
+
+export class MergeOutputPlugin {
+  private readonly opts: MergeOutputOpt
+
+  constructor (opts: MergeOutputOpt) {
+    this.opts = opts
+  }
+
+  apply (compiler: Compiler) {
+    compiler.hooks.compilation.tap(PLUGIN_NAME, (compilation: Compilation) => {
+      const stage = compiler.webpack.Compilation.PROCESS_ASSETS_STAGE_ADDITIONAL // 最早阶段，在优化前
+
+      compilation.hooks.processAssets.tap({ name: PLUGIN_NAME, stage }, (assets) => {
+        const mergedResult = Object.keys(assets).reduce((result, item) => {
+          if (!this.opts.test.test(item)) return result
+          const code = assets[item].source().toString()
+          delete assets[item]
+          return result + code + '\n'
+        }, '')
+
+        compilation.assets[this.opts.outputFile!] = new compiler.webpack.sources.RawSource(mergedResult)
+      })
+    })
+  }
+}

package/src/transform-app-stylesheet.ts

@@ -0,0 +1,17 @@
+import type { CompilationAssets, AsyncPackOpts } from './types'
+
+interface Opts extends AsyncPackOpts {
+    assets: CompilationAssets;
+}
+
+export const transformAppStylesheet = (code: string, opts: Opts) => {
+  const { dynamicModuleStyleFile, assets } = opts
+
+  const isDynamicModuleStyleFileExist = Object.keys(assets).some(assetName => {
+    return new RegExp(`${dynamicModuleStyleFile}\\.wxss`).test(assetName)
+  })
+
+  if (!isDynamicModuleStyleFileExist) return code
+
+  return code.concat(`@import './${dynamicModuleStyleFile}.wxss';`)
+}

package/src/transform-before-compression-plugin.ts

@@ -0,0 +1,45 @@
+import webpack from 'webpack'
+import { CompilationAssets } from './types'
+
+export interface TransformOpt {
+    assetName: string
+    source: string | Buffer
+    assets: CompilationAssets
+}
+
+export interface PluginOpt {
+    test?: RegExp;
+    transform: (opt: TransformOpt) => string;
+}
+
+export const PLUGIN_NAME = 'TransformBeforeCompression'
+
+export class TransformBeforeCompressionPlugin {
+  private readonly opt: PluginOpt
+
+  constructor (opt: PluginOpt) {
+    this.opt = opt
+  }
+
+  apply (compiler: webpack.Compiler) {
+    compiler.hooks.compilation.tap(PLUGIN_NAME, (compilation: webpack.Compilation) => {
+      const stage = webpack.Compilation.PROCESS_ASSETS_STAGE_OPTIMIZE // 压缩前
+
+      compilation.hooks.processAssets.tap({ name: PLUGIN_NAME, stage }, (assets) => {
+        const { test, transform } = this.opt
+
+        const assetNames = Object.keys(assets)
+
+        assetNames.forEach((assetName) => {
+          if (!test || !test.test(assetName)) return
+
+          const source = assets[assetName].source()
+
+          const transformResult = transform({ assetName, source, assets } as TransformOpt)
+
+          compilation.updateAsset(assetName, new webpack.sources.RawSource(transformResult))
+        })
+      })
+    })
+  }
+}

package/src/transform-webpack-runtime.ts

@@ -0,0 +1,138 @@
+import { NodePath, template } from '@babel/core'
+import generator from '@babel/generator'
+import * as parser from '@babel/parser'
+import traverse, { Node } from '@babel/traverse'
+import * as types from '@babel/types'
+import type { AssignmentExpression, VariableDeclarator } from '@babel/types'
+import type { CompilationAssets, AsyncPackOpts } from './types'
+
+interface Opts extends AsyncPackOpts {
+  assets: CompilationAssets;
+}
+
+const webpackLoadDynamicModuleTemplateDep = `
+  var loadedDynamicModules = {};
+  var loadDynamicModule = function (dynamicModulePath) {
+    var loadDynamicModuleFn = loadDynamicModuleFnMap[dynamicModulePath];
+    return loadDynamicModuleFn ? loadDynamicModuleFn() : Promise.reject();
+  };
+  var promiseRetry = function (apply,retries = 6,delay = 500) {
+    return apply().catch(function (error) {
+      if (retries <= 0) return Promise.reject(error);
+      return new Promise(function (resolve) {
+          setTimeout(resolve, delay);
+       })
+       .then(function () {
+          return promiseRetry(apply, retries - 1, delay)
+       });
+    })
+  }
+`
+
+const webpackLoadDynamicModuleTemplate = `
+  __webpack_require__.l = function (dynamicModulePath, done, key, chunkId) {
+    if (inProgress[dynamicModulePath]) {
+      inProgress[dynamicModulePath].push(done);
+      return;
+    }
+
+    const target = { src: dynamicModulePath };
+
+    if (loadedDynamicModules[dynamicModulePath]) return done({ type: 'loaded', target });
+
+    promiseRetry(function () {
+      return loadDynamicModule(dynamicModulePath)
+    })
+    .then(function () {
+      return done({ type: 'loaded', target })
+    }).catch(function () {
+      return done({ type:'error', target })
+    });
+  };
+`
+
+const replaceWebpackLoadScriptFn = (assignmentExpressionNodePath: NodePath<AssignmentExpression>, opts: Opts) => {
+  const { left, right } = assignmentExpressionNodePath.node || {}
+
+  if (!types.isMemberExpression(left)) return
+
+  if (!types.isFunctionExpression(right)) return
+
+  if (!types.isIdentifier(left.object, { name: '__webpack_require__' })) return
+
+  if (!types.isIdentifier(left.property, { name: 'l' })) return
+
+  const isProcessed = right.params.some((item) => {
+    return types.isIdentifier(item, { name: 'dynamicModulePath' })
+  })
+
+  if (isProcessed) return
+
+  const { assets, dynamicModuleJsDir } = opts
+
+  const dynamicAssets = Object.keys(assets).filter((assetName) => {
+    return new RegExp(`^${dynamicModuleJsDir}/.`).test(assetName)
+  })
+
+  const loadDynamicModuleFnMapCode = (() => {
+    const tempCode = dynamicAssets.map((dynamicAsset) => {
+      return `'/${dynamicAsset}':function (){ return require.async('${dynamicAsset}'); }`
+    })
+    return `var loadDynamicModuleFnMap = {${tempCode.join(',')}}`
+  })()
+
+  const templateCodeAst = template.ast(webpackLoadDynamicModuleTemplate)
+
+  const templateCodeDepAst = template.ast(webpackLoadDynamicModuleTemplateDep)
+
+  const loadDynamicModuleFnMapAst = template.ast(loadDynamicModuleFnMapCode)
+
+  assignmentExpressionNodePath.replaceWith(templateCodeAst as Node)
+
+  assignmentExpressionNodePath.insertBefore(templateCodeDepAst)
+
+  assignmentExpressionNodePath.insertBefore(loadDynamicModuleFnMapAst)
+}
+
+const webpackLoadDynamicModuleStylesheetTemplate = `
+loadStylesheet = function () {
+  return Promise.resolve()
+}
+`
+
+const replaceLoadStylesheetFn = (nodePath: NodePath<VariableDeclarator>) => {
+  const { id, init } = nodePath.node || {}
+  if (!types.isIdentifier(id, { name: 'loadStylesheet' })) return
+  if (!types.isFunctionExpression(init)) return
+  const isProcessed = !init.params.length
+  if (isProcessed) return
+  const templateCodeAst = template.expression(webpackLoadDynamicModuleStylesheetTemplate)()
+  nodePath.replaceWith(templateCodeAst)
+}
+
+const removeCreateStylesheetFn = (nodePath: NodePath<VariableDeclarator>) => {
+  const { id } = nodePath.node || {}
+  if (!types.isIdentifier(id, { name: 'createStylesheet' })) return
+  nodePath.remove()
+}
+
+const removeFindStylesheetFn = (nodePath: NodePath<VariableDeclarator>) => {
+  const { id } = nodePath.node || {}
+  if (!types.isIdentifier(id, { name: 'findStylesheet' })) return
+  nodePath.remove()
+}
+
+export const transformWebpackRuntime = (code: string, opts: Opts) => {
+  const ast = parser.parse(code) // 将代码解析为 AST
+  traverse(ast, {
+    AssignmentExpression: (nodePath: NodePath<AssignmentExpression>) => {
+      replaceWebpackLoadScriptFn(nodePath, opts)
+    },
+    VariableDeclarator (nodePath: NodePath<VariableDeclarator>) {
+      replaceLoadStylesheetFn(nodePath)
+      removeCreateStylesheetFn(nodePath)
+      removeFindStylesheetFn(nodePath)
+    }
+  })
+  return generator(ast).code
+}

package/src/types.ts

@@ -0,0 +1,8 @@
+import { Source } from 'webpack-sources'
+
+export interface AsyncPackOpts {
+  dynamicModuleJsDir: string;
+  dynamicModuleStyleFile: string;
+}
+
+export type CompilationAssets = Record<string, Source>;

package/tsconfig.json

@@ -0,0 +1,20 @@
+{
+  "compilerOptions": {
+    "target": "ES2015",
+    "module": "commonjs",
+    "strict": true,
+    "sourceMap": true,
+    "declaration": true,
+    "esModuleInterop": true,
+    "moduleResolution": "node",
+    // 声明文件生成到的文件目录
+    "outDir": "./dist/",
+    "skipLibCheck": true,
+    /* Skip type checking of declaration files. */
+    "forceConsistentCasingInFileNames": true,
+    "jsx": "react",
+    "lib": ["esnext", "dom"],
+    "types": ["@types/node"]
+  },
+  "include": ["src"]
+}