xhs-mp-compiler-cli 1.1.3 → 1.1.5

package/dist/presets/loaders/sjs-loader/scope.js

@@ -0,0 +1,122 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ScopeManager = exports.Scope = exports.SPECIFY_VAR = void 0;
+exports.SPECIFY_VAR = ["getDate", "getRegExp", "console"];
+const IDENTIFIER_WHITE_LIST = [
+    "Object", "Boolean", "Array", "String", "Number", "Date", "Map", "Set",
+    "decodeURI", "decodeURIComponent", "encodeURI", "encodeURIComponent", "isNaN", "isFinite", "parseFloat", "parseInt",
+    "Infinity", "NaN", "undefined",
+    "setTimeout", "clearTimeout", "setInterval", "clearInterval",
+    "JSON", "Math",
+    // 模块化
+    "module", "require", "exports",
+    ...exports.SPECIFY_VAR
+];
+// 变量作用域表
+class Scope {
+    constructor() {
+        // 当前作用域定义的变量
+        this.defines = {};
+        // 当前作用域使用的变量
+        this.access = {};
+    }
+    toString() {
+        return `defines: ${Object.keys(this.defines)} access: ${Object.keys(this.access)}`;
+    }
+    /**
+     * @returns
+     */
+    anlysis() {
+        // TODO 优化算法复杂度
+        // 在自身作用域 以及 上级作用域寻找，找到顶层作用域时 则需要看 白名单是否含有
+        for (const variable in this.access) {
+            // 白名单也不包含此变量
+            if (this.checkGlobal(variable) && !IDENTIFIER_WHITE_LIST.includes(variable)) {
+                return { variable, span: this.access[variable] };
+            }
+        }
+        return undefined;
+    }
+    // 检查是否是全局调用
+    checkGlobal(key) {
+        let scope = this;
+        while (scope) {
+            if (!scope.defines[key]) {
+                scope = scope.parentScope;
+                continue;
+            }
+            else {
+                return false;
+            }
+        }
+        return !scope;
+    }
+    setAccess(key, value) {
+        this.access[key] = value;
+    }
+    setDefines(key, value) {
+        this.defines[key] = value;
+    }
+    setParentScope(scope) {
+        this.parentScope = scope;
+    }
+}
+exports.Scope = Scope;
+class ScopeManager {
+    constructor() {
+        // 栈帧
+        this._scopeStack = [];
+        // 栈 深度遍历结果
+        this._scopeTables = [];
+        // 是否停止收集
+        this._stop = false;
+    }
+    // 停止分析
+    stop() {
+        this._stop = true;
+    }
+    enterScope() {
+        if (this._stop)
+            return;
+        this._scopeStack.push(new Scope());
+    }
+    exitScope() {
+        if (this._stop)
+            return;
+        const scope = this._scopeStack.pop();
+        if (scope) {
+            this._scopeTables.push(scope);
+            scope.setParentScope(this.getCurrentScope());
+        }
+    }
+    getCurrentScope() {
+        if (this._stop)
+            return;
+        return this._scopeStack[this._scopeStack.length - 1];
+    }
+    // 记录定义的值
+    pushIdentifier(id) {
+        var _a;
+        if (this._stop)
+            return;
+        if (this.getCurrentScope()) {
+            (_a = this.getCurrentScope()) === null || _a === void 0 ? void 0 : _a.setDefines(id.value, id.span);
+        }
+    }
+    // 记录使用的值
+    pushAccess(id) {
+        if (this._stop)
+            return;
+        const current = this.getCurrentScope();
+        if (current) {
+            current === null || current === void 0 ? void 0 : current.setAccess(id.value, id.span);
+            if (exports.SPECIFY_VAR.includes(id.value)) {
+                id._xhsScope = current;
+            }
+        }
+    }
+    getDFSScope() {
+        return this._scopeTables;
+    }
+}
+exports.ScopeManager = ScopeManager;

package/dist/presets/loaders/sjs-loader/tranform.d.ts

@@ -0,0 +1,2 @@
+import type { JscTarget, Program } from '@swc/core';
+export declare const transform: (code: string, plugin?: ((m: Program) => Program) | undefined, target?: JscTarget, minify?: boolean) => import("@swc/core").Output;

package/dist/presets/loaders/sjs-loader/tranform.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.transform = void 0;
+const core_1 = require("@swc/core");
+const transform = (code, plugin, target = 'esnext', minify = false) => (0, core_1.transformSync)(code, {
+    swcrc: false,
+    configFile: false,
+    minify,
+    sourceMaps: false,
+    jsc: {
+        preserveAllComments: true,
+        target,
+        // minify: false,
+        externalHelpers: false,
+        parser: {
+            syntax: "ecmascript",
+            jsx: false,
+            dynamicImport: false,
+            privateMethod: false,
+            functionBind: false,
+            classPrivateProperty: false,
+            exportDefaultFrom: false,
+            exportNamespaceFrom: false,
+            decorators: false,
+            decoratorsBeforeExport: false,
+            importMeta: false,
+        },
+    },
+    plugin,
+});
+exports.transform = transform;

package/dist/presets/loaders/wxss-loader.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/presets/loaders/wxss-loader.js

@@ -0,0 +1,77 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const postcss_1 = __importDefault(require("postcss"));
+const postcss_import_1 = __importDefault(require("postcss-import"));
+const postcss_prefix_selector_1 = __importDefault(require("postcss-prefix-selector"));
+const CssSyntaxError_1 = __importDefault(require("css-loader/dist/CssSyntaxError"));
+const tagTransformMap_1 = __importDefault(require("../../utils/tagTransformMap"));
+const getSuffixName_1 = require("../../utils/getSuffixName");
+const common_1 = require("../../utils/common");
+const tags = Object.keys(tagTransformMap_1.default).join('|');
+const labelStr = `(^|\\s)(${tags}|page|audio|live-player|map|cover-view|cover-image|video)`;
+const labelReg = new RegExp(labelStr, 'g');
+function wxssLoader(source) {
+    return __awaiter(this, void 0, void 0, function* () {
+        var _a, _b, _c, _d, _e;
+        const done = this.async();
+        const { project } = this._compiler;
+        const { appJSON = {}, miniprogramDir = '' } = project || {};
+        const shortPath = (0, common_1.getShortPath)(miniprogramDir, this.resourcePath).replace(new RegExp(`\\.${(0, getSuffixName_1.getCssSuffixName)()}$`), '');
+        const index = (_c = (_b = (_a = appJSON === null || appJSON === void 0 ? void 0 : appJSON.componentsMap) === null || _a === void 0 ? void 0 : _a[shortPath]) === null || _b === void 0 ? void 0 : _b.index) !== null && _c !== void 0 ? _c : null;
+        const styleIsolation = (_e = (_d = appJSON === null || appJSON === void 0 ? void 0 : appJSON.componentsMap) === null || _d === void 0 ? void 0 : _d[shortPath]) === null || _e === void 0 ? void 0 : _e.styleIsolation;
+        const selectorIndex = styleIsolation === 'shared' ? 0 : index || 0;
+        // js / json 的配置会影响样式
+        const extReg = new RegExp(`${(0, getSuffixName_1.getCssSuffixName)()}$`);
+        this.addDependency(this.resourcePath.replace(extReg, 'js'));
+        this.addDependency(this.resourcePath.replace(extReg, 'json'));
+        (0, postcss_1.default)()
+            // @ts-ignore
+            .use((0, postcss_import_1.default)({ root: miniprogramDir }))
+            .use((0, postcss_prefix_selector_1.default)({
+            prefix: 'xhs',
+            transform(prefix, selector) {
+                // 支持 host 选择器 https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/wxml-wxss.html
+                if (selector === ':host') {
+                    return `[is="${shortPath}"]`;
+                }
+                /**
+                 * 替换所有类选择器，用于做样式隔离 wiki: https://wiki.xiaohongshu.com/pages/viewpage.action?pageId=181017177
+                 * .app -> .xhs_0_app
+                 */
+                selector = selector.replace(/\.(\w)/g, `.xhs_${selectorIndex}_$1`);
+                // 为内置组件加上 xhs 前缀
+                if (selector.match(labelReg)) {
+                    selector = selector.replace(labelReg, `$1${prefix}-$2`);
+                }
+                return selector;
+            },
+        }))
+            .process(source, {
+            from: this.resourcePath,
+        })
+            .then(result => {
+            result.messages.forEach(({ file, type }) => {
+                if (type === 'dependency') {
+                    this.addDependency(file);
+                }
+            });
+            done(null, result.css);
+        })
+            .catch(error => {
+            done(error.name === 'CssSyntaxError' ? new CssSyntaxError_1.default(error) : error);
+        });
+    });
+}
+module.exports = wxssLoader;

package/dist/presets/plugins/InjectorPlugin.d.ts

@@ -0,0 +1,7 @@
+import { ICompiler } from '../../packs';
+import { IPresetOptions } from '../../types';
+export declare class InjectorPlugin {
+    options: IPresetOptions;
+    constructor(options: IPresetOptions);
+    apply(compiler: ICompiler): void;
+}

package/dist/presets/plugins/InjectorPlugin.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InjectorPlugin = void 0;
+class InjectorPlugin {
+    constructor(options) {
+        this.options = options;
+    }
+    apply(compiler) {
+        const { project, packSetting } = this.options;
+        compiler.project = project;
+        compiler.packSetting = packSetting;
+    }
+}
+exports.InjectorPlugin = InjectorPlugin;

package/dist/presets/prod.d.ts

@@ -0,0 +1,4 @@
+import { Config } from '../packs';
+import { IPresetOptions } from '../types';
+declare const getProdConfig: (chain: Config, options: IPresetOptions) => void;
+export default getProdConfig;

package/dist/presets/prod.js

@@ -0,0 +1,80 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const const_1 = __importDefault(require("../utils/const"));
+// import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer'
+const getProdConfig = (chain, options) => {
+    const { project, packSetting, otherSetting = {} } = options;
+    const { compressJs } = packSetting;
+    chain.mode('production');
+    if (!otherSetting.noJs) {
+        // 生产环境使用 babel-loader
+        if (project.appMode === 'miniprogram') {
+            chain.module
+                .rule('js')
+                .use('js-loader')
+                .loader(require.resolve('babel-loader'))
+                .options({
+                configFile: false,
+                babelrc: false,
+                sourceType: 'unambiguous',
+                presets: [
+                    [
+                        require.resolve('@babel/preset-env'),
+                        {
+                            useBuiltIns: false,
+                            corejs: {
+                                version: 3,
+                                proposals: true
+                            },
+                            shippedProposals: true,
+                            targets: const_1.default.PROD_BROWSERSLIST
+                        }
+                    ]
+                ],
+                plugins: [[require.resolve('@babel/plugin-transform-runtime'), { corejs: false }]]
+            });
+            chain.module
+                .rule('ts')
+                .use('ts-loader')
+                .loader(require.resolve('babel-loader'))
+                .options({
+                sourceType: 'unambiguous',
+                presets: [
+                    [
+                        require.resolve('@babel/preset-typescript'),
+                        {
+                            allExtensions: true,
+                            isTSX: true
+                        }
+                    ],
+                    [
+                        require.resolve('@babel/preset-env'),
+                        {
+                            useBuiltIns: false,
+                            corejs: {
+                                version: 3,
+                                proposals: true
+                            },
+                            shippedProposals: true,
+                            targets: const_1.default.PROD_BROWSERSLIST
+                        }
+                    ]
+                ],
+                plugins: [[require.resolve('@babel/plugin-transform-runtime'), { corejs: false }]]
+            });
+        }
+        chain.optimization.minimizer('js').use(require.resolve('terser-webpack-plugin'), [
+            {
+                terserOptions: {
+                    safari10: true,
+                    compress: { drop_console: false }
+                }
+            }
+        ]);
+    }
+    chain.optimization.minimize(!!compressJs);
+};
+exports.default = getProdConfig;

package/dist/types/index.d.ts

@@ -0,0 +1,118 @@
+import type { MPPackSetting } from "xhs-mp-pack";
+import type { Project } from "xhs-mp-project";
+export declare enum ENV {
+    development = 0,
+    production = 1
+}
+export interface Component {
+    index?: number;
+    usingComponents?: {
+        [key: string]: string;
+    };
+    componentPlaceholder?: {
+        [key: string]: string;
+    };
+}
+export interface Page {
+    path: string;
+    usingComponents?: {
+        [key: string]: string;
+    };
+    componentPlaceholder?: {
+        [key: string]: string;
+    };
+}
+export interface SubPackage {
+    root: string;
+    pages: Page[];
+    independent?: boolean;
+}
+export declare enum CodePackageMode {
+    default = "default",
+    requiredComponents = "requiredComponents"
+}
+export interface AppJSON {
+    pages: Page[];
+    subPackages: SubPackage[];
+    subpackages: SubPackage[];
+    usingComponents?: {
+        [key: string]: string;
+    };
+    lazyCodeLoading?: CodePackageMode;
+    componentsMap: {
+        [key: string]: Component;
+    };
+    xhsVersionStrategy: {
+        [key: string]: string | boolean;
+    };
+}
+export interface ICompilerConfig {
+    /**
+     * 小程序入口目录
+     */
+    projectPath: string;
+    miniprogramDir: string;
+    /**
+     * 构建产物目录
+     */
+    distDir?: string;
+    action: "dev" | "build";
+    watch?: boolean;
+    env: ENV;
+    tsConfigPath?: string;
+    /**
+     * ext json path
+     */
+    extJsonPath?: string;
+    cacheDirectory?: string;
+    /**
+     * 是否开启 Js 编译压缩
+     */
+    compressJs?: boolean;
+    /**
+     * 打包是否包含 js 文件
+     */
+    noJs?: boolean;
+    /**
+     * dev 模式是否开启 sourcemap，默认开启
+     */
+    enableSourcemap?: boolean;
+    /**
+     * 服务端口
+     */
+    port?: number;
+    enableV1?: boolean;
+    enableV2?: boolean;
+    enableVDom?: boolean;
+}
+type CliPick = 'projectPath' | 'distDir' | 'watch' | 'tsConfigPath' | 'extJsonPath' | 'cacheDirectory' | 'compressJs' | 'enableSourcemap' | 'enableV1' | 'enableV2' | 'enableVDom';
+export interface IStart extends Pick<ICompilerConfig, CliPick> {
+    packMode?: 'webpack' | 'mp-pack';
+    /**
+     * 调用的能力，dev 还是 build
+     */
+    action: 'dev' | 'build';
+    /**
+     * 是否启动dev-server
+     */
+    enableDevServer?: boolean;
+    /**
+     * 每次构建完毕的回调函数
+     */
+    callback?: () => void;
+    /**
+     * 构建产物目录
+     */
+    distDir?: string;
+    platform?: 'wx' | 'xhs';
+    /**
+     * 服务端口
+     */
+    devServerPort?: number;
+}
+export type IPresetOptions = {
+    project: Project;
+    packSetting: MPPackSetting;
+    otherSetting?: any;
+};
+export {};

package/dist/types/index.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CodePackageMode = exports.ENV = void 0;
+var ENV;
+(function (ENV) {
+    ENV[ENV["development"] = 0] = "development";
+    ENV[ENV["production"] = 1] = "production";
+})(ENV || (exports.ENV = ENV = {}));
+var CodePackageMode;
+(function (CodePackageMode) {
+    CodePackageMode["default"] = "default";
+    CodePackageMode["requiredComponents"] = "requiredComponents";
+})(CodePackageMode || (exports.CodePackageMode = CodePackageMode = {}));

package/dist/utils/asyncWebpack.d.ts

@@ -0,0 +1,3 @@
+import { Configuration } from 'webpack';
+declare const webpackCompile: (config: Configuration[], callback?: () => void) => Promise<unknown>;
+export default webpackCompile;

package/dist/utils/asyncWebpack.js

@@ -0,0 +1,38 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const webpack_1 = __importDefault(require("webpack"));
+const webpackCompile = (config, callback) => __awaiter(void 0, void 0, void 0, function* () {
+    return new Promise((res, rej) => {
+        (0, webpack_1.default)(config, (err, stats) => {
+            if (err) {
+                // eslint-disable-next-line
+                console.log(err);
+                rej(err);
+            }
+            else {
+                // eslint-disable-next-line
+                console.log(stats === null || stats === void 0 ? void 0 : stats.toString({
+                    modules: true,
+                    chunks: true,
+                    children: false,
+                    colors: true,
+                }));
+                callback === null || callback === void 0 ? void 0 : callback();
+                res(stats);
+            }
+        });
+    });
+});
+exports.default = webpackCompile;

package/dist/utils/common.d.ts

@@ -0,0 +1,8 @@
+export declare const getTsConfigPath: (projectPath: string) => string | undefined;
+export declare const isString: (val: unknown) => val is string;
+export declare const toUnixPath: (pathStr?: string) => string;
+export declare const unixJoin: (...paths: string[]) => string;
+export declare const unixResolve: (...paths: string[]) => string;
+export declare const getShortPath: (miniprogramDir: string, rootContext: string) => string;
+export declare const md5: (str: string) => string;
+export declare const DEFAULT_ENTRY = "game";

package/dist/utils/common.js

@@ -0,0 +1,36 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DEFAULT_ENTRY = exports.md5 = exports.getShortPath = exports.unixResolve = exports.unixJoin = exports.toUnixPath = exports.isString = exports.getTsConfigPath = void 0;
+const fs_extra_1 = __importDefault(require("fs-extra"));
+const path_1 = __importDefault(require("path"));
+const crypto_1 = __importDefault(require("crypto"));
+const getSuffixName_1 = require("./getSuffixName");
+const getTsConfigPath = (projectPath) => {
+    if (fs_extra_1.default.existsSync(`${projectPath}/tsconfig.json`)) {
+        return `${projectPath}/tsconfig.json`;
+    }
+    return undefined;
+};
+exports.getTsConfigPath = getTsConfigPath;
+const isString = (val) => typeof val === 'string';
+exports.isString = isString;
+const toUnixPath = (pathStr = '') => pathStr.split(path_1.default.sep).join(path_1.default.posix.sep);
+exports.toUnixPath = toUnixPath;
+const unixJoin = (...paths) => (0, exports.toUnixPath)(path_1.default.join(...paths));
+exports.unixJoin = unixJoin;
+const unixResolve = (...paths) => (0, exports.toUnixPath)(path_1.default.resolve(...paths));
+exports.unixResolve = unixResolve;
+const getShortPath = (miniprogramDir, rootContext) => {
+    const suffix = (0, getSuffixName_1.getMlSuffixName)();
+    miniprogramDir = (0, exports.toUnixPath)(miniprogramDir);
+    miniprogramDir = miniprogramDir.endsWith('/') ? miniprogramDir : `${miniprogramDir}/`;
+    const reg = new RegExp(`.${suffix}$`, 'g');
+    return (0, exports.toUnixPath)(rootContext).replace(reg, '').replace(miniprogramDir, '');
+};
+exports.getShortPath = getShortPath;
+const md5 = (str) => crypto_1.default.createHash('md5').update(str).digest('hex');
+exports.md5 = md5;
+exports.DEFAULT_ENTRY = "game";

package/dist/utils/const.d.ts

@@ -0,0 +1,27 @@
+declare const CONSTANTS: {
+    PROD_BROWSERSLIST: string[];
+    DEV_BROWSERSLIST: string[];
+    DEV_TARGETS: {
+        chrome: string;
+    };
+    PROD_TARGETS: {
+        chrome: string;
+        ios: string;
+    };
+    ENTRY_CSS_NAME: string;
+    FULL_PKG: string;
+    MAIN_PKG: string;
+    SUB_PKG: string;
+    BUILD_REASON: {
+        INIT: string;
+        FILE_CHANGE: string;
+        ACTIVATE_PKG: string;
+        RECOMPILE: string;
+    };
+    ASSETS_EXTS: string[];
+    PACK_MODE: {
+        MPPACK: string;
+        WEBPACK: string;
+    };
+};
+export default CONSTANTS;

package/dist/utils/const.js

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const CONSTANTS = {
+    PROD_BROWSERSLIST: ['ios_saf >= 10', 'chrome >= 83'],
+    DEV_BROWSERSLIST: ['last 2 chrome version'],
+    DEV_TARGETS: {
+        chrome: '90',
+    },
+    PROD_TARGETS: {
+        chrome: '83',
+        ios: '10'
+    },
+    ENTRY_CSS_NAME: 'app',
+    FULL_PKG: 'xhs-full',
+    MAIN_PKG: 'xhs-main',
+    SUB_PKG: 'xhs-sub',
+    BUILD_REASON: {
+        INIT: 'INIT',
+        FILE_CHANGE: 'FILE_CHANGE',
+        ACTIVATE_PKG: 'ACTIVATE_PKG',
+        RECOMPILE: 'RECOMPILE',
+    },
+    ASSETS_EXTS: [
+        'png',
+        'jpg',
+        'jpeg',
+        'gif',
+        'svg',
+        'webp',
+        'cer',
+        'mp3',
+        'aac',
+        'm4a',
+        'mp4',
+        'wav',
+        'ogg',
+        'silk',
+        'wasm',
+        'br',
+        'plist',
+    ],
+    PACK_MODE: {
+        MPPACK: 'mp-pack',
+        WEBPACK: 'webpack'
+    }
+};
+exports.default = CONSTANTS;

package/dist/utils/css.d.ts

@@ -0,0 +1,2 @@
+declare const getCssConfig: (options: any, presets: any) => any;
+export default getCssConfig;