xhs-mp-compiler-cli 1.0.1-beta.0

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleBindAttribute.js

@@ -0,0 +1,73 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const xhs_mp_compiler_utils_1 = require("xhs-mp-compiler-utils");
+const utils_1 = require("./utils");
+const handleSjsEvent_1 = require("./handleSjsEvent");
+const ML_EVENTS = [
+    'touchstart',
+    'touchend',
+    'touchmove',
+    'touchcancel',
+    'tap',
+    'longtap',
+    'longpress',
+];
+const animationEvents = ['transitionend', 'animationiteration', 'animationstart', 'animationend'];
+const handleBindAttribute = (value, attribute, node, filePath, importBy) => {
+    var _a;
+    // todo bindrefresherpulling 暂不支持
+    // 考虑 bindrefresherpulling="{{refresh.onPulling}}" 转换
+    if (attribute === 'bindrefresherpulling') {
+        return delete node.attribs[attribute];
+    }
+    let eventName = '';
+    const modifiers = [];
+    if (attribute.indexOf(':') !== -1) {
+        const splitAttribute = attribute.split(':');
+        eventName = splitAttribute[1];
+        // bind:touchstart
+        // capture-bind:touchstart
+        splitAttribute[0].split('-').forEach((item) => {
+            if (item !== 'bind') {
+                if (item === 'catch') {
+                    modifiers.push('stop');
+                }
+                else if (item === 'capture') {
+                    modifiers.push('capture');
+                }
+            }
+        });
+    }
+    else {
+        eventName = attribute.substr(4);
+    }
+    if ((0, handleSjsEvent_1.isSjsEvent)(value, node, importBy, filePath)) {
+        value = (0, handleSjsEvent_1.createSjsEventDeclaration)(value, node);
+    }
+    else {
+        if ((_a = (0, utils_1.matchMustache)(value)) === null || _a === void 0 ? void 0 : _a.length) {
+            node.attribs[`:${xhs_mp_compiler_utils_1.CompileAddedAttrs.EventMap}:${eventName}`] = `${(0, utils_1.injectContext2Exp)(value, node, 1)}`;
+        }
+        else {
+            node.attribs[`:${xhs_mp_compiler_utils_1.CompileAddedAttrs.EventMap}:${eventName}`] = `'${value}'`;
+        }
+        value = `(...args) => context[${(0, utils_1.injectContext2Exp)(value, node, 1)}](...args)`;
+    }
+    // ml通用事件走自定义指令的方式
+    if (ML_EVENTS.includes(eventName)) {
+        if (modifiers.length > 0) {
+            node.attribs[`v-finger:${eventName}.${modifiers.join('.')}`] = `${value}`;
+        }
+        else {
+            node.attribs[`v-finger:${eventName}`] = `${value}`;
+        }
+    }
+    else if (animationEvents.includes(eventName)) {
+        node.attribs[`@xhs_animate_${eventName}`] = `${value}`;
+    }
+    else {
+        node.attribs[`@${eventName}`] = `${value}`;
+    }
+    return delete node.attribs[attribute];
+};
+exports.default = handleBindAttribute;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleBlockTag.d.ts

@@ -0,0 +1,13 @@
+/**
+ * block 特性：
+ *
+ * - block 不支持 hidden 等模板语法，为避免其影响 vue 下行为，需要删除
+ * - block 不支持 style、class 等属性
+ * - block 仅支持 xhs:for、xhs:if、xhs:else、xhs:elif slot模板语法
+ * - block 支持嵌套
+ *
+ * 解决方案：
+ *  vue template 在属性存在 v-if 情况下，会提取他的内容作为条件块，因此结合 v-if = true 可以实现 block
+ */
+declare function handleBlockTag(node: any): void;
+export default handleBlockTag;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleBlockTag.js

@@ -0,0 +1,42 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const getPrefixName_1 = __importDefault(require("../../../../../utils/getPrefixName"));
+/**
+ * block 特性：
+ *
+ * - block 不支持 hidden 等模板语法，为避免其影响 vue 下行为，需要删除
+ * - block 不支持 style、class 等属性
+ * - block 仅支持 xhs:for、xhs:if、xhs:else、xhs:elif slot模板语法
+ * - block 支持嵌套
+ *
+ * 解决方案：
+ *  vue template 在属性存在 v-if 情况下，会提取他的内容作为条件块，因此结合 v-if = true 可以实现 block
+ */
+function handleBlockTag(node) {
+    node.name = 'template';
+    Object.keys(node.attribs).forEach(key => {
+        if (![
+            `${(0, getPrefixName_1.default)()}:for-item`,
+            `${(0, getPrefixName_1.default)()}:for-index`,
+            `${(0, getPrefixName_1.default)()}:for`,
+            `${(0, getPrefixName_1.default)()}:for-items`,
+            `${(0, getPrefixName_1.default)()}:key`,
+            `${(0, getPrefixName_1.default)()}:if`,
+            `${(0, getPrefixName_1.default)()}:else`,
+            `${(0, getPrefixName_1.default)()}:elif`,
+            'slot',
+        ].includes(key)) {
+            delete node.attribs[key];
+        }
+    });
+    if (typeof node.attribs[`${(0, getPrefixName_1.default)()}:if`] === 'undefined' &&
+        typeof node.attribs[`${(0, getPrefixName_1.default)()}:else`] === 'undefined' &&
+        typeof node.attribs[`${(0, getPrefixName_1.default)()}:elif`] === 'undefined' &&
+        typeof node.attribs[`${(0, getPrefixName_1.default)()}:for`] === 'undefined') {
+        node.attribs[`v-if`] = 'true';
+    }
+}
+exports.default = handleBlockTag;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleCatchAttribute.d.ts

@@ -0,0 +1,2 @@
+declare const handleCatchAttribute: (value: any, attribute: any, node: any, filePath: string, importBy: string) => boolean;
+export default handleCatchAttribute;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleCatchAttribute.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const xhs_mp_compiler_utils_1 = require("xhs-mp-compiler-utils");
+const handleSjsEvent_1 = require("./handleSjsEvent");
+const utils_1 = require("./utils");
+const handleCatchAttribute = (value, attribute, node, filePath, importBy) => {
+    var _a;
+    let eventName = '';
+    if (attribute.indexOf(':') !== -1) {
+        eventName = attribute.split(':')[1];
+    }
+    else {
+        eventName = attribute.substr(5);
+    }
+    if ((0, handleSjsEvent_1.isSjsEvent)(value, node, importBy, filePath)) {
+        value = (0, handleSjsEvent_1.createSjsEventDeclaration)(value, node);
+    }
+    else {
+        if ((_a = (0, utils_1.matchMustache)(value)) === null || _a === void 0 ? void 0 : _a.length) {
+            node.attribs[`:${xhs_mp_compiler_utils_1.CompileAddedAttrs.EventMap}:${eventName}`] = `${(0, utils_1.injectContext2Exp)(value, node, 1)}`;
+        }
+        else {
+            node.attribs[`:${xhs_mp_compiler_utils_1.CompileAddedAttrs.EventMap}:${eventName}`] = `'${value}'`;
+        }
+        value = `(...args) => context[${(0, utils_1.injectContext2Exp)(value, node, 1)}]?.(...args)`;
+    }
+    node.attribs[`v-finger:${eventName}.stop`] = `${value}`;
+    return delete node.attribs[attribute];
+};
+exports.default = handleCatchAttribute;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleClassAttribute.d.ts

@@ -0,0 +1,2 @@
+declare const handleClassAttribute: (attribute: string, value: string, node: any) => void;
+export default handleClassAttribute;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleClassAttribute.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const xhs_mp_compiler_utils_1 = require("xhs-mp-compiler-utils");
+const utils_1 = require("./utils");
+const handleClassAttribute = (attribute, value, node) => {
+    var _a;
+    const { CalcClass } = xhs_mp_compiler_utils_1.CompileCallRuntimeMethodsNames;
+    if ((_a = (0, utils_1.matchMustache)(value)) === null || _a === void 0 ? void 0 : _a.length) {
+        const className = (0, utils_1.injectContext2Exp)(value, node, 1);
+        node.attribs[`:${attribute}`] = `${xhs_mp_compiler_utils_1.COMPILE_CALL_RUNTIME}('${CalcClass}', ${className}, 1)`;
+    }
+    else {
+        node.attribs[`:${attribute}`] = `${xhs_mp_compiler_utils_1.COMPILE_CALL_RUNTIME}('${CalcClass}', \`${value}\`, 1)`;
+    }
+    delete node.attribs[attribute];
+};
+exports.default = handleClassAttribute;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleDataAttribute.d.ts

@@ -0,0 +1,2 @@
+declare const handleDataAttribute: (value: any, attribute: any, node: any) => void;
+export default handleDataAttribute;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleDataAttribute.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const utils_1 = require("./utils");
+const handleDataAttribute = (value, attribute, node) => {
+    const dynamicValue = (0, utils_1.matchMustache)(value);
+    if ((dynamicValue === null || dynamicValue === void 0 ? void 0 : dynamicValue.length) === 1 && value.startsWith('{{') && value.endsWith('}}')) {
+        node.attribs[`:${attribute}`] = (0, utils_1.injectContext2Exp)(value, node, 3);
+        delete node.attribs[attribute];
+    }
+    else if (value === '') {
+        node.attribs[`:${attribute}`] = "true";
+        delete node.attribs[attribute];
+    }
+    else if (dynamicValue === null || dynamicValue === void 0 ? void 0 : dynamicValue.length) {
+        node.attribs[`:${attribute}`] = (0, utils_1.injectContext2Exp)(value, node, 5);
+        delete node.attribs[attribute];
+    }
+    else {
+        node.attribs[`:${attribute}`] = `JSON.stringify(\`${value}\`)`;
+        delete node.attribs[attribute];
+    }
+};
+exports.default = handleDataAttribute;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleHiddenAttribute.d.ts

@@ -0,0 +1,13 @@
+/**
+ * 微信 hidden 特性：
+ * - hidden 与 style display 可以同时使用，style display 优先级高（**我们的设计**： hidden 优先级高于 style display，不建议同时使用）
+ * - hidden 不对 block 生效
+ * - hidden 对所有基础组件生效
+ * - hidden 仅隐藏 DOM 元素
+ * - hidden="" 认为不隐藏(**我们的设计**：hidden="" 认为隐藏)
+ *
+ * 解决方案：
+ *  通过 v-show 实现
+ */
+declare const handleHiddenAttribute: (value: any, attribute: any, node: any) => void;
+export default handleHiddenAttribute;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleHiddenAttribute.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const utils_1 = require("./utils");
+/**
+ * 微信 hidden 特性：
+ * - hidden 与 style display 可以同时使用，style display 优先级高（**我们的设计**： hidden 优先级高于 style display，不建议同时使用）
+ * - hidden 不对 block 生效
+ * - hidden 对所有基础组件生效
+ * - hidden 仅隐藏 DOM 元素
+ * - hidden="" 认为不隐藏(**我们的设计**：hidden="" 认为隐藏)
+ *
+ * 解决方案：
+ *  通过 v-show 实现
+ */
+const handleHiddenAttribute = (value, attribute, node) => {
+    const dynamicValue = (0, utils_1.matchMustache)(value);
+    if (dynamicValue === null || dynamicValue === void 0 ? void 0 : dynamicValue.length) {
+        node.attribs['v-show'] = `!${(0, utils_1.injectContext2Exp)(value, node, 2)}`;
+    }
+    else {
+        node.attribs['v-show'] = false;
+    }
+    delete node.attribs[attribute];
+};
+exports.default = handleHiddenAttribute;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleImportTag.d.ts

@@ -0,0 +1,4 @@
+declare const handleImportTag: (node: any, filePath: string, importMap?: {
+    [key: string]: string[];
+}) => Promise<void>;
+export default handleImportTag;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleImportTag.js

@@ -0,0 +1,30 @@
+"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 path_1 = __importDefault(require("path"));
+const utils_1 = require("../utils");
+const common_1 = require("../../../../../utils/common");
+const handleImportTag = (node_1, filePath_1, ...args_1) => __awaiter(void 0, [node_1, filePath_1, ...args_1], void 0, function* (node, filePath, importMap = {}) {
+    const targetFilePath = (0, common_1.unixResolve)(path_1.default.dirname(filePath), node.attribs.src);
+    importMap[filePath] = importMap[filePath] || [targetFilePath];
+    if (!importMap[filePath].includes(targetFilePath)) {
+        importMap[filePath].push(targetFilePath);
+    }
+    const compName = (0, utils_1.formatPathToVar)(targetFilePath);
+    node.name = 'XhsVueImportInclude';
+    node.attribs.compName = compName;
+    node.attribs[':getComp'] = 'getComp';
+    Reflect.deleteProperty(node.attribs, 'src');
+});
+exports.default = handleImportTag;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleIncludeTag.d.ts

@@ -0,0 +1,2 @@
+declare const handleIncludeTag: (node: any, filePath: any, includeMap: any) => Promise<void>;
+export default handleIncludeTag;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleIncludeTag.js

@@ -0,0 +1,30 @@
+"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 path_1 = __importDefault(require("path"));
+const utils_1 = require("../utils");
+const common_1 = require("../../../../../utils/common");
+const handleIncludeTag = (node, filePath, includeMap) => __awaiter(void 0, void 0, void 0, function* () {
+    const targetFilePath = (0, common_1.unixResolve)(path_1.default.dirname(filePath), node.attribs.src);
+    includeMap[filePath] = includeMap[filePath] || [targetFilePath];
+    if (!includeMap[filePath].includes(targetFilePath)) {
+        includeMap[filePath].push(targetFilePath);
+    }
+    const compName = (0, utils_1.formatPathToVar)(targetFilePath);
+    node.name = 'XhsVueImportInclude';
+    node.attribs.compName = compName;
+    node.attribs[':getComp'] = 'getComp';
+    Reflect.deleteProperty(node.attribs, 'src');
+});
+exports.default = handleIncludeTag;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleLoopAttribute.d.ts

@@ -0,0 +1,2 @@
+declare const handleLoopAttribute: (node: any) => void;
+export default handleLoopAttribute;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleLoopAttribute.js

@@ -0,0 +1,89 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+// @ts-nocheck
+const clone_1 = __importDefault(require("clone"));
+const utils_1 = require("./utils");
+const getPrefixName_1 = __importDefault(require("../../../../../utils/getPrefixName"));
+const deleteForAttrs = (node) => {
+    ;
+    [
+        `${(0, getPrefixName_1.default)()}:for-item`,
+        `${(0, getPrefixName_1.default)()}:for-index`,
+        `${(0, getPrefixName_1.default)()}:for`,
+        `${(0, getPrefixName_1.default)()}:for-items`,
+        `${(0, getPrefixName_1.default)()}:key`,
+    ].forEach(attr => delete node.attribs[attr]);
+};
+const handleLoopAttribute = (node) => {
+    const forItem = node.attribs[`${(0, getPrefixName_1.default)()}:for-item`] || 'item';
+    const forIndex = node.attribs[`${(0, getPrefixName_1.default)()}:for-index`] || 'index';
+    const loopContext = node.loopContext ? [...node.loopContext, forItem, forIndex] : [forItem, forIndex];
+    (0, utils_1.addContextToNode)({
+        nodes: node,
+        loopContext,
+        underTemplate: node.underTemplate,
+    });
+    const forContent = (0, utils_1.injectContext2Exp)((node.attribs[`${(0, getPrefixName_1.default)()}:for`] || node.attribs[`${(0, getPrefixName_1.default)()}:for-items`]), node, 7);
+    /**
+     * v-for & v-if 不共存，https://v3.cn.vuejs.org/guide/list.html#%E5%9C%A8-template-%E4%B8%AD%E4%BD%BF%E7%94%A8-v-for
+     * 转换为：
+     * ```vue
+     * <template v-for="item in 10">
+     *  <template v-if="item % 3 === 0">
+     *    {{ item }}
+     *  </template>
+     * </template>
+     * ```
+     */
+    if (node.attribs[`${(0, getPrefixName_1.default)()}:if`]) {
+        const condition = node.attribs[`${(0, getPrefixName_1.default)()}:if`];
+        const cloneNode = node.cloneNode ? node.cloneNode(true) : (0, clone_1.default)(node);
+        deleteForAttrs(cloneNode);
+        (0, utils_1.addContextToNode)({
+            nodes: cloneNode,
+            loopContext,
+            underTemplate: node.underTemplate,
+        });
+        node.name = 'template';
+        node.attribs = { 'v-for': `(${forItem}, ${forIndex}) in ${forContent}` };
+        node.children = [
+            {
+                attribs: { [`${(0, getPrefixName_1.default)()}:if`]: condition },
+                type: 'tag',
+                name: 'template',
+                children: [cloneNode],
+                loopContext: node.loopContext
+            }
+        ];
+        return;
+    }
+    let key = node.attribs[`${(0, getPrefixName_1.default)()}:key`];
+    node.attribs['v-for'] = `(${forItem}, ${forIndex}) in ${forContent}`;
+    if (key) {
+        if (key === '*this' || key === '*item') {
+            // *items 官方 demo 有这种写法
+            key = forItem;
+        }
+        else if (key === forIndex) {
+            key = forIndex;
+        }
+        else if (key.match(/{{(.*?)}}/)) {
+            // 官方 demo 还有旧的写法
+            key = key.match(/{{(.*?)}}/)[1];
+        }
+        else if (key === forItem) {
+            // xhs:key="item" 保持不变
+            key = forItem;
+        }
+        else if (!key.startsWith(`${forItem}.`)) {
+            // xhs:key="itemId" ->  xhs:key="item.itemId"
+            key = `${forItem}.${key}`;
+        }
+        node.attribs[':key'] = key;
+    }
+    deleteForAttrs(node);
+};
+exports.default = handleLoopAttribute;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleMLAttribute.d.ts

@@ -0,0 +1,2 @@
+declare const handleMLAttribute: (value: any, attribute: any, node: any) => void;
+export default handleMLAttribute;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleMLAttribute.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const utils_1 = require("./utils");
+const handleMLAttribute = (value, attribute, node) => {
+    const attrName = attribute.split(':')[1];
+    const dynamicValue = (0, utils_1.matchMustache)(value);
+    switch (attrName) {
+        case 'if':
+            if (dynamicValue === null || dynamicValue === void 0 ? void 0 : dynamicValue.length) {
+                node.attribs['v-if'] = (0, utils_1.injectContext2Exp)(value, node, 2);
+            }
+            else {
+                node.attribs['v-if'] = `\`${value}\``;
+            }
+            delete node.attribs[attribute];
+            break;
+        case 'else':
+            node.attribs['v-else'] = null;
+            delete node.attribs[attribute];
+            break;
+        case 'elif':
+            if (dynamicValue === null || dynamicValue === void 0 ? void 0 : dynamicValue.length) {
+                node.attribs['v-else-if'] = (0, utils_1.injectContext2Exp)(value, node, 2);
+            }
+            else {
+                node.attribs['v-if'] = `\`${value}\``;
+            }
+            delete node.attribs[attribute];
+            break;
+        default:
+    }
+};
+exports.default = handleMLAttribute;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleModelAttribute.d.ts

@@ -0,0 +1,2 @@
+declare const handleModelAttribute: (value: any, attribute: any, node: any) => void;
+export default handleModelAttribute;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleModelAttribute.js

@@ -0,0 +1,61 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const xhs_mp_compiler_utils_1 = require("xhs-mp-compiler-utils");
+const tagTransformMap_1 = __importDefault(require("../../../../lib/tagTransformMap"));
+const updateTpl = (matchVal, bindChange) => `($event) => {
+  ${bindChange};postMessage({
+    type: 'component',
+    event: 'twoWayBindingChange',
+    payload: {
+      propName: '${matchVal}',
+      args: {
+        value: $event.detail.value
+      },
+    },
+    cid: __$cid,
+  })
+}`;
+const compUpdateTpl = (matchVal) => `__$RedData__.${matchVal} = $event; 
+postMessage({
+  type: 'component',
+  event: 'twoWayBindingChange',
+  payload: {
+    propName: '${matchVal}',
+    args: {
+      value: $event,
+    },
+  },
+  cid: __$cid,
+})`;
+const handleModelAttribute = (value, attribute, node) => {
+    const matchVal = value.replace(/{{|}}/g, '').trim();
+    const internalComponents = Object.values(tagTransformMap_1.default);
+    if (internalComponents.includes(node.name)) {
+        let valueProp = 'value';
+        if (['xhs-vue-checkbox', 'xhs-vue-switch'].includes(node.name)) {
+            valueProp = 'checked';
+        }
+        if (['xhs-vue-input'].includes(node.name)) {
+            node.attribs['@input'] = updateTpl(matchVal, '');
+        }
+        else if (node.attribs['@change']) {
+            const methodName = node.attribs['@change'].match(/context\[`(.*?)`\]/)[1];
+            node.attribs['@change'] = updateTpl(matchVal, `${methodName}($event)`);
+        }
+        else {
+            node.attribs['@change'] = updateTpl(matchVal, '');
+        }
+        node.attribs[`:${valueProp}`] = `${xhs_mp_compiler_utils_1.COMPILE_CALL_RUNTIME}('${xhs_mp_compiler_utils_1.CompileCallRuntimeMethodsNames.ExecExpWithContext}', '${matchVal}', {})`;
+    }
+    else {
+        const name = attribute.split(':')[1];
+        node.attribs[`:${name}`] = `__$RedData__.${matchVal}`;
+        node.attribs[`@update:${name}`] = compUpdateTpl(matchVal);
+        node.attribs[':__xhsVModelProps__'] = `{${name}: '${matchVal}'}`;
+    }
+    delete node.attribs[attribute];
+};
+exports.default = handleModelAttribute;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleOtherAttribute.d.ts

@@ -0,0 +1,2 @@
+declare const handleOtherAttribute: (value: any, attribute: any, node: any) => void;
+export default handleOtherAttribute;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleOtherAttribute.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const utils_1 = require("./utils");
+const handleOtherAttribute = (value, attribute, node) => {
+    const dynamicValue = (0, utils_1.matchMustache)(value);
+    /**
+     * 单个的模板语法不能改成模板字符串，否则会发生隐式转换，例如：
+     * <input :checked="`${checked}`" type="checkbox" value="first_checkbox" />
+     * checked 为 false 时变成了 `false`
+     */
+    if ((dynamicValue === null || dynamicValue === void 0 ? void 0 : dynamicValue.length) === 1 && value.startsWith('{{') && value.endsWith('}}')) {
+        node.attribs[`:${attribute}`] = (0, utils_1.injectContext2Exp)(value, node, 2);
+        delete node.attribs[attribute];
+    }
+    else if (value === '') {
+        const shouldReplaceValueToTrue = !attribute.startsWith('v-slot');
+        if (shouldReplaceValueToTrue) {
+            node.attribs[`:${attribute}`] = 'true';
+            delete node.attribs[attribute];
+        }
+    }
+    else {
+        /**
+         * 对其他使用模板语法 attribs 进行转换 ，例如：
+         * <navigator url="/page/component/pages/{{page}}/{{page}}" />
+         */
+        // eslint-disable-next-line no-lonely-if
+        if (dynamicValue === null || dynamicValue === void 0 ? void 0 : dynamicValue.length) {
+            // eslint-disable-line
+            node.attribs[`:${attribute}`] = (0, utils_1.injectContext2Exp)(value, node, 1);
+            delete node.attribs[attribute];
+        }
+    }
+};
+exports.default = handleOtherAttribute;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleSjsEvent.d.ts

@@ -0,0 +1,11 @@
+/**
+ * 当前是否使用了 sjs 的变量
+ * @internal
+ */
+export declare function isSjsEvent(value: string, node: any, importBy: string, filePath: string): boolean;
+/**
+ * create a function declaration character
+ * @param { value } string - expression
+ * @returns { string }
+ */
+export declare function createSjsEventDeclaration(value: string, node: any): string;

package/dist/webpack-config/loaders/ml-loader/ml2vue/transformerUtils/handleSjsEvent.js

@@ -0,0 +1,72 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createSjsEventDeclaration = exports.isSjsEvent = void 0;
+const utils_1 = require("./utils");
+const SjsModule_1 = __importDefault(require("../../../../../globalData/SjsModule"));
+/**
+ * @param { exp } string - expression
+ * @param { sjsScopeNames } string[] - sjs module scopes
+ * @returns { boolean }
+ */
+function isSjsScopeExp(exp, sjsScopeNames) {
+    if ((0, utils_1.matchMustache)(exp)) {
+        exp = exp.replace(/{{(.*?)}}/g, (_, $1) => $1);
+    }
+    exp = exp === null || exp === void 0 ? void 0 : exp.trim();
+    return !!sjsScopeNames.find(scope => exp.indexOf(`${scope}.`) === 0);
+}
+/**
+ * 当前是否使用了 sjs 的变量
+ * @internal
+ */
+function isSjsEvent(value, node, importBy, filePath) {
+    var _a, _b;
+    let sjsScopeNames = null;
+    // 处理 template 模板编译场景下
+    if (node.underTemplate) {
+        if (SjsModule_1.default.templateHashToModuleName.has(importBy)) {
+            sjsScopeNames = SjsModule_1.default.templateHashToModuleName.get(importBy) || [];
+        }
+        if (!sjsScopeNames || sjsScopeNames.length === 0)
+            return false;
+        return isSjsScopeExp(value, sjsScopeNames);
+    }
+    if (!filePath || !((_a = SjsModule_1.default === null || SjsModule_1.default === void 0 ? void 0 : SjsModule_1.default.moduleMap) === null || _a === void 0 ? void 0 : _a[filePath]))
+        return false;
+    // 非 template 模板下处理
+    const sjsModuleMap = ((_b = SjsModule_1.default === null || SjsModule_1.default === void 0 ? void 0 : SjsModule_1.default.moduleMap) === null || _b === void 0 ? void 0 : _b[filePath]) || {};
+    sjsScopeNames = Object.keys(sjsModuleMap) || [];
+    if (!sjsScopeNames.length)
+        return false;
+    return isSjsScopeExp(value, sjsScopeNames);
+}
+exports.isSjsEvent = isSjsEvent;
+/**
+ * create a function declaration character
+ * @param { value } string - expression
+ * @returns { string }
+ */
+function createSjsEventDeclaration(value, node) {
+    if (node.underTemplate) {
+        const { loopContext = [], underTemplate } = node;
+        const loopContextStr = loopContext.join(', ');
+        const templateContextStr = '...data';
+        let context = '{}';
+        if (loopContext.length && underTemplate) {
+            // 对齐微信表现，两者都存在时 loopContext 在后
+            context = `{${templateContextStr}, ${loopContextStr}}, ${underTemplate}`;
+        }
+        else if (loopContext.length && !underTemplate) {
+            context = `{${loopContextStr}}`;
+        }
+        else if (!loopContext.length && underTemplate) {
+            context = `{${templateContextStr}}, ${underTemplate}`;
+        }
+        return `(...args) => context.$handleSjsEvent(\`${value.replace(/{{(.*?)}}/g, (_, $1) => $1)}\`, args, ${context})`;
+    }
+    return `(...args) => context.$handleSjsEvent(\`${value.replace(/{{(.*?)}}/g, (_, $1) => $1)}\`, args)`;
+}
+exports.createSjsEventDeclaration = createSjsEventDeclaration;