mp-weixin-back 0.0.7 → 0.0.9

package/dist/index.cjs

@@ -4,9 +4,10 @@ const path = require('path');
 const fs = require('fs');
 const JSON5 = require('json5');
 const kolorist = require('kolorist');
-const generate = require('@babel/generator');
 const compilerSfc = require('@vue/compiler-sfc');
+const generate = require('@babel/generator');
 const astKit = require('ast-kit');
+const MagicString = require('magic-string');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e.default : e; }
 
@@ -14,130 +15,328 @@ const path__default = /*#__PURE__*/_interopDefaultCompat(path);
 const fs__default = /*#__PURE__*/_interopDefaultCompat(fs);
 const JSON5__default = /*#__PURE__*/_interopDefaultCompat(JSON5);
 const generate__default = /*#__PURE__*/_interopDefaultCompat(generate);
+const MagicString__default = /*#__PURE__*/_interopDefaultCompat(MagicString);
 
 const virtualFileId = "mp-weixin-back-helper";
 
+const pageContainerComp = '  <page-container :show="__MP_BACK_SHOW_PAGE_CONTAINER__" :overlay="false" @beforeleave="onBeforeLeave" :z-index="1" :duration="false"></page-container>\n';
 function isArrowFunction(func) {
   if (typeof func !== "function")
     return false;
   return !func.hasOwnProperty("prototype") && func.toString().includes("=>");
 }
-async function parseSFC(code) {
-  try {
-    return compilerSfc.parse(code).descriptor;
-  } catch (error) {
-    throw new Error(`\u89E3\u6790vue\u6587\u4EF6\u5931\u8D25\uFF0C\u8BF7\u68C0\u67E5\u6587\u4EF6\u662F\u5426\u6B63\u786E`);
-  }
-}
-async function transformVueFile(code, id) {
-  if (code.includes("<page-container")) {
-    return code;
-  }
-  if (!code.includes("<template")) {
-    return code;
-  }
-  const componentStr = '<page-container :show="__MP_BACK_SHOW_PAGE_CONTAINER__" :overlay="false" @beforeleave="onBeforeLeave" :z-index="1" :duration="false"></page-container>';
-  const sfc = await parseSFC(code);
-  const setupCode = sfc.scriptSetup?.loc.source;
-  const setupAst = astKit.babelParse(setupCode || "", sfc.scriptSetup?.lang);
-  let pageBackConfig = this.config;
-  let hasPageBack = false, hasImportRef = false, pageBackFnName = "onPageBack", callbackCode = ``;
+function compositionWalk(context, code, sfc, id) {
+  const codeMs = new MagicString__default(code);
+  const setupAst = astKit.babelParse(sfc.scriptSetup.loc.source, sfc.scriptSetup.lang);
+  let pageInfo = {
+    hasPageBack: false,
+    pageBackFnName: "onPageBack",
+    hasImportRef: false,
+    backConfig: { ...context.config },
+    callbackCode: ""
+  };
   if (setupAst) {
     astKit.walkAST(setupAst, {
       enter(node) {
-        if (node.type == "ImportDeclaration" && node.source.value.includes(virtualFileId)) {
-          const importSpecifier = node.specifiers[0];
-          hasPageBack = true;
-          pageBackFnName = importSpecifier.local.name;
-        }
-        if (node.type == "ImportDeclaration" && node.source.value === "vue") {
-          const importSpecifiers = node.specifiers;
-          for (let i = 0; i < importSpecifiers.length; i++) {
-            const element = importSpecifiers[i];
-            if (element.local.name == "ref") {
-              hasImportRef = true;
-              break;
-            }
+        if (node.type === "ImportDeclaration") {
+          if (node.source.value.includes(virtualFileId)) {
+            const importSpecifier = node.specifiers[0];
+            pageInfo.hasPageBack = true;
+            pageInfo.pageBackFnName = importSpecifier.local.name;
+          }
+          if (node.source.value === "vue") {
+            node.specifiers.some((specifier) => {
+              if (specifier.local.name === "ref") {
+                pageInfo.hasImportRef = true;
+                return true;
+              }
+              return false;
+            });
           }
         }
-        if (node.type == "ExpressionStatement" && node.expression.type == "CallExpression" && node.expression.callee.loc?.identifierName == pageBackFnName) {
+        if (node.type === "ExpressionStatement" && node.expression.type === "CallExpression" && node.expression.callee.loc?.identifierName === pageInfo.pageBackFnName) {
           const callback = node.expression.arguments[0];
           const backArguments = node.expression.arguments[1];
-          if (backArguments && backArguments.type == "ObjectExpression") {
+          if (backArguments?.type === "ObjectExpression") {
             const config = new Function(
               // @ts-ignore
               `return (${(generate__default.default ? generate__default.default : generate__default)(backArguments).code});`
             )();
-            pageBackConfig = { ...pageBackConfig, ...config };
+            Object.assign(pageInfo.backConfig, config);
           }
           if (callback && (callback.type === "ArrowFunctionExpression" || callback.type === "FunctionExpression")) {
             const body = callback.body;
             if (body.type === "BlockStatement") {
-              body.body.forEach((statement) => {
-                callbackCode += (generate__default.default ? generate__default.default : generate__default)(statement).code;
-              });
+              pageInfo.callbackCode += body.body.map(
+                // @ts-ignore
+                (statement) => (generate__default.default ? generate__default.default : generate__default)(statement).code
+              ).join("");
             }
           }
         }
       }
     });
   }
-  if (!hasPageBack)
-    return;
-  this.log.devLog(`\u9875\u9762${this.getPageById(id)}\u6CE8\u5165mp-weixin-back`);
-  if (!pageBackConfig.preventDefault) {
-    callbackCode += `uni.navigateBack({ delta: 1 });`;
+  if (!pageInfo.hasPageBack)
+    return code;
+  if (code.includes("<page-container")) {
+    context.log.debugLog(`${context.getPageById(id)}\u9875\u9762\u5DF2\u6709page-container\u7EC4\u4EF6\uFF0C\u6CE8\u5165\u5931\u8D25`);
+    return code;
+  }
+  if (!pageInfo.backConfig.preventDefault) {
+    pageInfo.callbackCode += "uni.navigateBack({ delta: 1 });";
   }
+  const importRefFromVue = !pageInfo.hasImportRef ? `import { ref } from 'vue'` : "";
+  const stateFrequency = "let __MP_BACK_FREQUENCY__ = 1;";
+  const statePageContainerVar = "const __MP_BACK_SHOW_PAGE_CONTAINER__ = ref(true);";
   const configBack = (() => {
-    if (!pageBackConfig.onPageBack)
+    const onPageBack = pageInfo.backConfig.onPageBack;
+    if (!onPageBack)
       return "";
-    if (typeof pageBackConfig.onPageBack !== "function") {
+    if (typeof onPageBack !== "function") {
       throw new Error("`onPageBack` must be a function");
     }
-    const params = JSON.stringify({
-      page: this.getPageById(id)
-    });
-    const hasFunction = pageBackConfig.onPageBack.toString().includes("function");
-    if (isArrowFunction(pageBackConfig.onPageBack) || hasFunction) {
-      return `(${pageBackConfig.onPageBack})(${params});`;
+    const params = JSON.stringify({ page: context.getPageById(id) });
+    if (isArrowFunction(onPageBack) || onPageBack.toString().includes("function")) {
+      return `(${onPageBack})(${params});`;
     }
-    return `(function ${pageBackConfig.onPageBack})()`;
+    return `(function ${onPageBack})()`;
   })();
-  const beforeLeaveStr = `
-    ${!hasImportRef ? "import { ref } from 'vue'" : ""}
-    let __MP_BACK_FREQUENCY__ = 1
-    const __MP_BACK_SHOW_PAGE_CONTAINER__ = ref(true);
+  const stateBeforeLeave = `
     const onBeforeLeave = () => {
-      console.log("__MP_BACK_FREQUENCY__", __MP_BACK_FREQUENCY__, ${pageBackConfig.frequency})
-      if (__MP_BACK_FREQUENCY__ < ${pageBackConfig.frequency}) {
+      if (__MP_BACK_FREQUENCY__ < ${pageInfo.backConfig.frequency}) {
         __MP_BACK_SHOW_PAGE_CONTAINER__.value = false
-        setTimeout(() => {
-          __MP_BACK_SHOW_PAGE_CONTAINER__.value = true
-        }, 0);
+        setTimeout(() => __MP_BACK_SHOW_PAGE_CONTAINER__.value = true, 0);
         __MP_BACK_FREQUENCY__++
       }
-      // \u8FD0\u884C\u914D\u7F6E\u7684\u533F\u540D\u51FD\u6570
       ${configBack}
-      ${callbackCode}
+      ${pageInfo.callbackCode}
     };
   `;
-  const result = code.replace(
-    /(<template.*?>)([\s\S]*?)(<\/template>)([\s\S]*?)(<script\s+(?:lang="ts"\s+)?setup.*?>|$)/,
-    (match, templateStart, templateContent, templateEnd, middleContent, scriptSetup) => {
-      const hasScriptSetup = Boolean(scriptSetup);
-      const scriptStartTag = hasScriptSetup ? scriptSetup : "<script setup>";
-      const scriptEndTag = hasScriptSetup ? "" : "<\/script>";
-      const injectedTemplate = `${templateStart}${templateContent}
- ${componentStr}
-${templateEnd}`;
-      const injectedScript = `
-${middleContent}${scriptStartTag}
-${beforeLeaveStr}
-${scriptEndTag}`;
-      return injectedTemplate + injectedScript;
+  const { template, scriptSetup } = sfc;
+  const tempOffsets = {
+    start: template.loc.start.offset,
+    end: template.loc.end.offset,
+    content: template.content
+  };
+  const templateMagicString = new MagicString__default(tempOffsets.content);
+  templateMagicString.append(pageContainerComp);
+  codeMs.overwrite(tempOffsets.start, tempOffsets.end, templateMagicString.toString());
+  const scriptOffsets = {
+    start: scriptSetup.loc.start.offset,
+    end: scriptSetup.loc.end.offset,
+    content: scriptSetup.content || ""
+  };
+  const scriptMagicString = new MagicString__default(scriptOffsets.content);
+  scriptMagicString.prepend(
+    ` ${importRefFromVue}
+      ${stateFrequency}
+      ${statePageContainerVar}
+      ${stateBeforeLeave} `
+  );
+  codeMs.overwrite(scriptOffsets.start, scriptOffsets.end, scriptMagicString.toString());
+  return codeMs.toString();
+}
+function optionsWalk(context, code, sfc, id) {
+  const codeMs = new MagicString__default(code);
+  const ast = astKit.babelParse(sfc.script.loc.source, sfc.script.lang);
+  let pageInfo = {
+    hasPageBack: false,
+    pageBackFnName: "onPageBack",
+    backConfig: { ...context.config }
+  };
+  let exportDefaultNode = null;
+  let dataMethodNode = null;
+  let methodsNode = null;
+  let onPageBackNodeMethod = null;
+  let onPageBackNodeProperty = null;
+  if (ast) {
+    astKit.walkAST(ast, {
+      enter(node) {
+        if (node.type === "ExportDefaultDeclaration" && node.declaration.type === "ObjectExpression") {
+          exportDefaultNode = node.declaration;
+          const properties = node.declaration.properties;
+          for (let i = 0; i < properties.length; i++) {
+            const element = properties[i];
+            if (element.type === "ObjectMethod" && element.key.type === "Identifier" && element.key.name === "data" && element.body.type === "BlockStatement") {
+              dataMethodNode = element.body;
+            }
+            if (element.type === "ObjectProperty" && element.key.type === "Identifier" && element.key.name === "methods") {
+              methodsNode = element.value;
+            }
+            const blockStatementCondition = element.type === "ObjectMethod" && element.key.type === "Identifier" && element.key.name === pageInfo.pageBackFnName && element.body.type === "BlockStatement";
+            const functionExpressionCondition = element.type === "ObjectProperty" && element.key.type === "Identifier" && element.key.name === pageInfo.pageBackFnName && element.value.type === "FunctionExpression";
+            if (blockStatementCondition) {
+              pageInfo.hasPageBack = true;
+              onPageBackNodeMethod = element;
+            }
+            if (functionExpressionCondition) {
+              pageInfo.hasPageBack = true;
+              onPageBackNodeProperty = element;
+            }
+          }
+        }
+      }
+    });
+  }
+  if (!pageInfo.hasPageBack)
+    return;
+  const newDataProperty = [
+    {
+      type: "ObjectProperty",
+      key: { type: "Identifier", name: "__MP_BACK_SHOW_PAGE_CONTAINER__" },
+      value: { type: "BooleanLiteral", value: true },
+      computed: false,
+      shorthand: false
+    },
+    {
+      type: "ObjectProperty",
+      key: { type: "Identifier", name: "__MP_BACK_FREQUENCY__" },
+      value: { type: "NumericLiteral", value: 1 },
+      computed: false,
+      shorthand: false
+    }
+  ];
+  if (dataMethodNode) {
+    const returnStatement = dataMethodNode.body.find(
+      (node) => node.type === "ReturnStatement"
+    );
+    if (returnStatement && returnStatement.argument && returnStatement.argument.type === "ObjectExpression") {
+      returnStatement.argument.properties.push(...newDataProperty);
     }
+  } else if (exportDefaultNode) {
+    const addData = {
+      type: "ObjectMethod",
+      key: { type: "Identifier", name: "data" },
+      kind: "method",
+      params: [],
+      async: false,
+      generator: false,
+      computed: false,
+      body: {
+        type: "BlockStatement",
+        directives: [],
+        body: [
+          {
+            type: "ReturnStatement",
+            argument: {
+              type: "ObjectExpression",
+              properties: newDataProperty
+            }
+          }
+        ]
+      }
+    };
+    exportDefaultNode.properties.push(addData);
+  }
+  const configBack = (() => {
+    const onPageBack = pageInfo.backConfig.onPageBack;
+    if (!onPageBack)
+      return "";
+    if (typeof onPageBack !== "function") {
+      throw new Error("`onPageBack` must be a function");
+    }
+    const params = JSON.stringify({ page: context.getPageById(id) });
+    if (isArrowFunction(onPageBack) || onPageBack.toString().includes("function")) {
+      return `(${onPageBack})(${params});`;
+    }
+    return `(function ${onPageBack})()`;
+  })();
+  const stateBeforeLeave = `
+    function onBeforeLeave() {
+      if (this.__MP_BACK_FREQUENCY__ < ${pageInfo.backConfig.frequency}) {
+        this.__MP_BACK_SHOW_PAGE_CONTAINER__ = false
+        setTimeout(() => { this.__MP_BACK_SHOW_PAGE_CONTAINER__ = true }, 0);
+        this.__MP_BACK_FREQUENCY__++
+      }
+      ${configBack}
+      ${!pageInfo.backConfig.preventDefault ? "uni.navigateBack({ delta: 1 });" : ""}
+    };
+  `;
+  const stateBeforeLeaveAst = astKit.babelParse(stateBeforeLeave);
+  const stateBeforeLeaveNode = stateBeforeLeaveAst.body.find(
+    (node) => node.type === "FunctionDeclaration"
   );
-  return result;
+  const newMethodsProperty = {
+    type: "ObjectMethod",
+    key: {
+      type: "Identifier",
+      name: "onBeforeLeave"
+    },
+    kind: "method",
+    generator: false,
+    async: false,
+    params: [],
+    computed: false,
+    body: {
+      type: "BlockStatement",
+      directives: [],
+      body: [
+        ...onPageBackNodeMethod ? onPageBackNodeMethod.body.body : [],
+        ...onPageBackNodeProperty ? onPageBackNodeProperty.value.body.body : [],
+        ...stateBeforeLeaveNode.body.body
+      ]
+    }
+  };
+  if (methodsNode) {
+    methodsNode.properties.push(newMethodsProperty);
+    const code2 = (generate__default.default ? generate__default.default : generate__default)(methodsNode);
+    console.log(code2);
+  } else if (exportDefaultNode) {
+    const addMethods = {
+      type: "ObjectProperty",
+      computed: false,
+      shorthand: false,
+      key: {
+        type: "Identifier",
+        name: "methods"
+      },
+      value: {
+        type: "ObjectExpression",
+        properties: [newMethodsProperty]
+      }
+    };
+    exportDefaultNode.properties.push(addMethods);
+  }
+  const { template, script } = sfc;
+  const tempOffsets = {
+    start: template.loc.start.offset,
+    end: template.loc.end.offset,
+    content: template.content
+  };
+  const templateMagicString = new MagicString__default(tempOffsets.content);
+  templateMagicString.append(pageContainerComp);
+  codeMs.overwrite(tempOffsets.start, tempOffsets.end, templateMagicString.toString());
+  const scriptOffsets = {
+    start: script.loc.start.offset,
+    end: script.loc.end.offset
+  };
+  const newScriptContent = (generate__default.default ? generate__default.default : generate__default)(ast).code;
+  codeMs.overwrite(scriptOffsets.start, scriptOffsets.end, newScriptContent);
+  return codeMs.toString();
+}
+const vueWalker = {
+  compositionWalk,
+  optionsWalk
+};
+
+async function transformVueFile(code, id) {
+  try {
+    const sfc = compilerSfc.parse(code).descriptor;
+    const { template, script, scriptSetup } = sfc;
+    if (!template?.content) {
+      return code;
+    }
+    if (!script?.content && !scriptSetup?.content) {
+      return code;
+    }
+    const walker = scriptSetup ? "compositionWalk" : "optionsWalk";
+    return vueWalker[walker](this, code, sfc, id);
+  } catch (error) {
+    this.log.error("\u89E3\u6790vue\u6587\u4EF6\u5931\u8D25\uFF0C\u8BF7\u68C0\u67E5\u6587\u4EF6\u662F\u5426\u6B63\u786E");
+    this.log.debugLog(String(error));
+    return code;
+  }
 }
 
 var __defProp = Object.defineProperty;
@@ -148,18 +347,19 @@ var __publicField = (obj, key, value) => {
 };
 class pageContext {
   constructor(config) {
+    __publicField(this, "logPreText", "[mp-weixin-back] : ");
     __publicField(this, "config");
     __publicField(this, "pages", []);
     __publicField(this, "log", {
       info: (text) => {
-        console.log(kolorist.white(text));
+        console.log(kolorist.white(this.logPreText + text));
       },
       error: (text) => {
-        console.log(kolorist.red(text));
+        console.log(kolorist.red(this.logPreText + text));
       },
-      devLog: (text) => {
+      debugLog: (text) => {
         if (this.config.mode === "development" && this.config.debug) {
-          console.log(kolorist.green(text));
+          console.log(kolorist.green(this.logPreText + text));
         }
       }
     });
@@ -198,7 +398,7 @@ class pageContext {
       }
     } catch (error) {
       this.log.error("\u8BFB\u53D6pages.json\u6587\u4EF6\u5931\u8D25");
-      this.log.devLog(String(error));
+      this.log.debugLog(String(error));
     }
   }
   // 获取指定id的page