@codelet/cli-service 0.0.15 → 0.0.17

package/dist/config.d.ts

@@ -4,6 +4,8 @@ export interface Config {
     entryPath?: string;
     /** 入口文件 */
     source?: string[];
+    /** 不参与打包、运行时 require 的外部脚本 */
+    externalSource?: string[];
     /** 第一页 */
     pageIndex?: string;
     /** 静态文件 */

package/dist/config.js

@@ -10,13 +10,15 @@ const inject_chunk_webpack_plugin_1 = __importDefault(require("@codelet/inject-c
 const mini_css_extract_plugin_1 = __importDefault(require("mini-css-extract-plugin"));
 const terser_webpack_plugin_1 = __importDefault(require("terser-webpack-plugin"));
 const copy_webpack_plugin_1 = __importDefault(require("copy-webpack-plugin"));
+const path_1 = __importDefault(require("path"));
 const webpackbar_1 = __importDefault(require("webpackbar"));
 const utils_1 = require("./utils");
 function getDefaultConfig(options) {
-    const { entryPath, source, pageIndex, publicDir, isDev } = Object.assign({
+    const { entryPath, source, externalSource, pageIndex, publicDir, isDev } = Object.assign({
         isDev: false,
         pageIndex: '',
         publicDir: 'public',
+        externalSource: [],
         entryPath: './src',
         source: [
             'app.(js|ts)',
@@ -24,6 +26,11 @@ function getDefaultConfig(options) {
             'packages/*/(pages|components)/**/index.(js|ts)',
         ],
     }, options);
+    const externalFiles = (0, utils_1.resolveExternalFiles)(entryPath, externalSource);
+    const resolveExternalFile = (0, utils_1.createExternalRequestResolver)({
+        entryPath,
+        externalFiles,
+    });
     // 模式
     const mode = isDev ? 'development' : 'production';
     // 插件
@@ -42,68 +49,20 @@ function getDefaultConfig(options) {
                     to: './', // 复制到输出目录（dist）的根路径
                     noErrorOnMissing: true, // 若 public 目录不存在时不报错
                 },
+                ...(0, utils_1.createExternalCopyPatterns)(entryPath, externalSource),
             ],
         }),
         new webpackbar_1.default(),
     ];
+    if (externalSource.length > 0) {
+        plugins.push(new utils_1.RewriteExternalRequestPlugin());
+    }
     if (isDev) {
         plugins.push(new hmr_webpack_plugin_1.default());
     }
     // 优化
-    const packageRootPattern = /[\\/]src[\\/]packages[\\/]([^\\/]+)[\\/]/;
-    const getPackageBundleName = (name) => {
-        const normalizedName = name.replace(/\\/g, '/');
-        if (normalizedName.startsWith('packages/')) {
-            const [, packageName] = normalizedName.split('/');
-            if (packageName) {
-                return `packages/${packageName}/bundle`;
-            }
-        }
-        return null;
-    };
-    const getModuleResource = (module) => {
-        if (!module || typeof module !== 'object') {
-            return '';
-        }
-        return 'resource' in module && typeof module.resource === 'string' ? module.resource : '';
-    };
-    const optimization = {
-        splitChunks: {
-            chunks: 'all',
-            minChunks: 2,
-            minSize: 0,
-            cacheGroups: {
-                subpackage: {
-                    test(module) {
-                        return Boolean(getModuleResource(module).match(packageRootPattern));
-                    },
-                    name(module, chunks) {
-                        const match = getModuleResource(module).match(packageRootPattern);
-                        if (!match) {
-                            return 'bundle';
-                        }
-                        const packageBundleName = `packages/${match[1]}/bundle`;
-                        const bundleNames = new Set(chunks
-                            .map((chunk) => chunk.name)
-                            .filter((name) => typeof name === 'string' && Boolean(name))
-                            .map((name) => getPackageBundleName(name))
-                            .filter((name) => typeof name === 'string' && Boolean(name)));
-                        return bundleNames.size <= 1 && bundleNames.has(packageBundleName)
-                            ? packageBundleName
-                            : 'bundle';
-                    },
-                    priority: 10,
-                    minChunks: 2,
-                    chunks: 'all',
-                },
-                main: {
-                    name: 'bundle',
-                    minChunks: 2,
-                    chunks: 'all',
-                },
-            },
-        },
-    };
+    // 将 splitChunks 的组装逻辑放到 utils 中，保持这里专注于默认配置拼装。
+    const optimization = (0, utils_1.createOptimization)();
     // 生产环境
     if (!isDev) {
         optimization.minimize = true;
@@ -123,10 +82,34 @@ function getDefaultConfig(options) {
         pageIndex,
         entryPath,
         source,
+        externalSource,
         publicDir,
         webpack: {
             mode,
             devtool: false,
+            ...(externalSource.length > 0
+                ? {
+                    externalsType: 'commonjs',
+                    externals: [
+                        ({ context, request }, callback) => {
+                            if (!context || !request) {
+                                callback();
+                                return;
+                            }
+                            const targetFile = resolveExternalFile(context, request);
+                            if (!targetFile) {
+                                callback();
+                                return;
+                            }
+                            const targetRequest = path_1.default
+                                .relative((0, utils_1.resolve)(entryPath), targetFile)
+                                .replace(/\\/g, '/')
+                                .replace(/\.js$/, '');
+                            callback(null, `commonjs ${utils_1.externalRequestPlaceholderPrefix}${targetRequest}`);
+                        },
+                    ],
+                }
+                : {}),
             output: {
                 filename: '[name].js',
                 path: (0, utils_1.resolve)('dist'),
@@ -135,7 +118,7 @@ function getDefaultConfig(options) {
             },
             resolve: {
                 alias: {
-                    '@': (0, utils_1.resolve)('src'),
+                    '@': (0, utils_1.resolve)(entryPath),
                 },
                 extensions: ['.js', '.ts'],
             },

package/dist/utils.d.ts

@@ -1,12 +1,26 @@
-import type { Configuration } from 'webpack';
+import type { ObjectPattern } from 'copy-webpack-plugin';
+import { type Compiler, type Configuration } from 'webpack';
 export declare const cmd: string;
+export declare const externalRequestPlaceholderPrefix = "__CODELET_EXTERNAL__/";
 export declare const resolve: (...args: string[]) => string;
+export declare const resolveEntryRoot: (entryPath: string) => string;
+export declare const resolveSourceRoot: (entryPath: string) => string;
 export declare const parseDir: (entryPath: string, source: string[]) => {
     entry: Record<string, {
         import: string;
         runtime: string;
     }>;
 };
+export declare const resolveExternalFiles: (entryPath: string, externalSource: string[]) => string[];
+export declare const createExternalCopyPatterns: (entryPath: string, externalSource: string[]) => ObjectPattern[];
+export declare const createExternalRequestResolver: (options: {
+    entryPath: string;
+    externalFiles: string[];
+}) => (context: string, request: string) => string;
+export declare class RewriteExternalRequestPlugin {
+    apply(compiler: Compiler): void;
+}
+export declare const createOptimization: () => NonNullable<Configuration["optimization"]>;
 export declare function getOptionValue(argv: string[], option: string): string | undefined;
 export declare function parseArgv(argv: string[]): {
     configPath: string;

package/dist/utils.js

@@ -3,20 +3,26 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.parseDir = exports.resolve = exports.cmd = void 0;
+exports.createOptimization = exports.RewriteExternalRequestPlugin = exports.createExternalRequestResolver = exports.createExternalCopyPatterns = exports.resolveExternalFiles = exports.parseDir = exports.resolveSourceRoot = exports.resolveEntryRoot = exports.resolve = exports.externalRequestPlaceholderPrefix = exports.cmd = void 0;
 exports.getOptionValue = getOptionValue;
 exports.parseArgv = parseArgv;
 exports.getConfig = getConfig;
 const fast_glob_1 = __importDefault(require("fast-glob"));
 const fs_1 = __importDefault(require("fs"));
 const path_1 = __importDefault(require("path"));
+const webpack_1 = require("webpack");
 const webpack_merge_1 = __importDefault(require("webpack-merge"));
 const config_1 = require("./config");
 exports.cmd = process.cwd();
+exports.externalRequestPlaceholderPrefix = '__CODELET_EXTERNAL__/';
 const resolve = (...args) => path_1.default.resolve(exports.cmd, ...args);
 exports.resolve = resolve;
+const resolveEntryRoot = (entryPath) => (0, exports.resolve)(entryPath);
+exports.resolveEntryRoot = resolveEntryRoot;
+const resolveSourceRoot = (entryPath) => (0, exports.resolveEntryRoot)(entryPath);
+exports.resolveSourceRoot = resolveSourceRoot;
 const parseDir = (entryPath, source) => {
-    entryPath = (0, exports.resolve)(entryPath);
+    entryPath = (0, exports.resolveEntryRoot)(entryPath);
     const filepaths = fast_glob_1.default.sync(source.map((item) => (0, exports.resolve)(entryPath, item).replace(/\\/g, '/')));
     const entry = filepaths.reduce((res, filepath) => {
         const relPath = path_1.default.relative(entryPath, filepath);
@@ -30,6 +36,137 @@ const parseDir = (entryPath, source) => {
     return { entry };
 };
 exports.parseDir = parseDir;
+const resolveExternalFiles = (entryPath, externalSource) => {
+    const entryRoot = (0, exports.resolveEntryRoot)(entryPath);
+    return fast_glob_1.default
+        .sync(externalSource.map((item) => path_1.default.join(entryRoot, item).replace(/\\/g, '/')))
+        .map((filepath) => path_1.default.resolve(filepath));
+};
+exports.resolveExternalFiles = resolveExternalFiles;
+const createExternalCopyPatterns = (entryPath, externalSource) => {
+    const entryRoot = (0, exports.resolveEntryRoot)(entryPath);
+    return externalSource.map((pattern) => ({
+        context: entryRoot,
+        from: pattern,
+        to: '[path][name][ext]',
+        noErrorOnMissing: true,
+    }));
+};
+exports.createExternalCopyPatterns = createExternalCopyPatterns;
+const createExternalRequestResolver = (options) => {
+    const entryRoot = (0, exports.resolveEntryRoot)(options.entryPath);
+    const externalFileSet = new Set(options.externalFiles);
+    return (context, request) => {
+        const candidates = [];
+        // 同时支持 "@/libs/foo" 这类别名引用和 "./libs/foo" 这类相对引用。
+        if (request.startsWith('@/')) {
+            candidates.push(path_1.default.join(entryRoot, request.slice(2)));
+        }
+        else if (request.startsWith('.')) {
+            candidates.push(path_1.default.resolve(context, request));
+        }
+        else {
+            return '';
+        }
+        for (const basePath of candidates) {
+            for (const ext of ['', '.js']) {
+                const candidate = ext ? `${basePath}${ext}` : basePath;
+                if (externalFileSet.has(path_1.default.resolve(candidate))) {
+                    return path_1.default.resolve(candidate);
+                }
+            }
+        }
+        return '';
+    };
+};
+exports.createExternalRequestResolver = createExternalRequestResolver;
+class RewriteExternalRequestPlugin {
+    apply(compiler) {
+        compiler.hooks.thisCompilation.tap('RewriteExternalRequestPlugin', (compilation) => {
+            compilation.hooks.processAssets.tap({
+                name: 'RewriteExternalRequestPlugin',
+                stage: webpack_1.Compilation.PROCESS_ASSETS_STAGE_OPTIMIZE_COMPATIBILITY,
+            }, (assets) => {
+                for (const assetName of Object.keys(assets)) {
+                    if (!assetName.endsWith('.js')) {
+                        continue;
+                    }
+                    const source = assets[assetName].source().toString();
+                    if (!source.includes(exports.externalRequestPlaceholderPrefix)) {
+                        continue;
+                    }
+                    // 基于最终产物文件的位置重新计算外部 require 路径，
+                    // 这样像 bundle.js 这类公共 chunk 也能拿到正确的运行时相对路径。
+                    const rewritten = source.replace(/__CODELET_EXTERNAL__\/([^"'`]+)/g, (_match, target) => {
+                        return path_1.default
+                            .relative(path_1.default.dirname(assetName), target)
+                            .replace(/\\/g, '/')
+                            .replace(/^(?!\.)/, './');
+                    });
+                    assets[assetName] = new webpack_1.sources.RawSource(rewritten);
+                }
+            });
+        });
+    }
+}
+exports.RewriteExternalRequestPlugin = RewriteExternalRequestPlugin;
+const createOptimization = () => {
+    const packageRootPattern = /[\\/]src[\\/]packages[\\/]([^\\/]+)[\\/]/;
+    const getPackageBundleName = (name) => {
+        const normalizedName = name.replace(/\\/g, '/');
+        if (normalizedName.startsWith('packages/')) {
+            const [, packageName] = normalizedName.split('/');
+            if (packageName) {
+                return `packages/${packageName}/bundle`;
+            }
+        }
+        return null;
+    };
+    const getModuleResource = (module) => {
+        if (!module || typeof module !== 'object') {
+            return '';
+        }
+        return 'resource' in module && typeof module.resource === 'string' ? module.resource : '';
+    };
+    return {
+        splitChunks: {
+            chunks: 'all',
+            minChunks: 2,
+            minSize: 0,
+            cacheGroups: {
+                subpackage: {
+                    test(module) {
+                        return Boolean(getModuleResource(module).match(packageRootPattern));
+                    },
+                    name(module, chunks) {
+                        const match = getModuleResource(module).match(packageRootPattern);
+                        if (!match) {
+                            return 'bundle';
+                        }
+                        const packageBundleName = `packages/${match[1]}/bundle`;
+                        const bundleNames = new Set(chunks
+                            .map((chunk) => chunk.name)
+                            .filter((name) => typeof name === 'string' && Boolean(name))
+                            .map((name) => getPackageBundleName(name))
+                            .filter((name) => typeof name === 'string' && Boolean(name)));
+                        return bundleNames.size <= 1 && bundleNames.has(packageBundleName)
+                            ? packageBundleName
+                            : 'bundle';
+                    },
+                    priority: 10,
+                    minChunks: 2,
+                    chunks: 'all',
+                },
+                main: {
+                    name: 'bundle',
+                    minChunks: 2,
+                    chunks: 'all',
+                },
+            },
+        },
+    };
+};
+exports.createOptimization = createOptimization;
 function getOptionValue(argv, option) {
     const index = argv.findIndex((item) => item === option);
     if (index > -1) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@codelet/cli-service",
-  "version": "0.0.15",
+  "version": "0.0.17",
   "description": "cli-service",
   "bin": {
     "codelet-cli-service": "./bin/codelet-cli-service.js"
@@ -41,10 +41,10 @@
     "webpack": "5.89.0",
     "webpack-merge": "^5.10.0",
     "webpackbar": "^6.0.0",
-    "@codelet/inject-chunk-webpack-plugin": "^0.0.8",
-    "@codelet/hmr-webpack-plugin": "^0.0.3",
     "@codelet/copy-loader": "^0.0.7",
     "@codelet/app-json-webpack-plugin": "^0.0.8",
+    "@codelet/hmr-webpack-plugin": "^0.0.3",
+    "@codelet/inject-chunk-webpack-plugin": "^0.0.8",
     "@codelet/wxml-loader": "^0.0.9"
   },
   "devDependencies": {