fix(babel-plugin-transform-taroapi): 修复h5 Component未定义的问题

NervJS · Aug 7, 2019 · 2e25f97 · 2e25f97
1 parent bc200e1
commit 2e25f97
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 24 deletions.
diff --git a/packages/babel-plugin-transform-taroapi/src/__tests__/__snapshots__/index-test.ts.snap b/packages/babel-plugin-transform-taroapi/src/__tests__/__snapshots__/index-test.ts.snap
@@ -65,7 +65,7 @@ export class Connected extends Taro.Component {}"
 
 exports[`should work! 1`] = `
 "
-import Taro, { getStorage as _getStorage, setStorage as _setStorage } from '@tarojs/taro-h5';
+import Taro, { setStorage as _setStorage, getStorage as _getStorage } from '@tarojs/taro-h5';
 Taro.initPxTransform(Taro.param);
 Taro.initPxTransform();
 Taro.initPxTransform();

diff --git a/packages/babel-plugin-transform-taroapi/src/index.ts b/packages/babel-plugin-transform-taroapi/src/index.ts
@@ -10,21 +10,40 @@ const plugin = function (babel: {
   let taroName: string
   let needDefault: boolean
 
-  let namedImports: Types.ImportSpecifier[]
+  let referrencedTaros: Types.Identifier[]
 
   return {
     name: 'babel-plugin-transform-taro-api',
     visitor: {
       ImportDeclaration (ast, state) {
         const packageName = state.opts.packageName
+        const apis = state.opts.apis
         if (ast.node.source.value !== packageName) return
 
         ast.node.specifiers.forEach(node => {
           if (t.isImportDefaultSpecifier(node)) {
             needDefault = true
             taroName = node.local.name
           } else if (t.isImportSpecifier(node)) {
-            namedImports.push(node)
+            const propertyName = node.imported.name
+            if (apis.has(propertyName)) { // 记录api名字
+              ast.scope.rename(node.local.name)
+              invokedApis.set(propertyName, node.local.name)
+            } else { // 如果是未实现的api 改成Taro.xxx
+              needDefault = true
+              const localName = node.local.name
+              const binding = ast.scope.getBinding(localName)
+              const iden = t.identifier(taroName)
+              referrencedTaros.push(iden)
+              binding && binding.referencePaths.forEach(reference => {
+                reference.replaceWith(
+                  t.memberExpression(
+                    iden,
+                    t.identifier(propertyName)
+                  )
+                )
+              })
+            }
           }
         })
       },
@@ -70,7 +89,7 @@ const plugin = function (babel: {
       Program: {
         enter (ast) {
           needDefault = false
-          namedImports = []
+          referrencedTaros = []
           invokedApis.clear()
 
           taroName = ast.scope.getBinding('Taro')
@@ -80,26 +99,8 @@ const plugin = function (babel: {
         exit (ast, state) {
           // 防止重复引入
           let isTaroApiImported = false
-          const apis = state.opts.apis
-
-          namedImports.forEach((node) => {
-            const propertyName = node.imported.name
-            if (apis.has(propertyName)) { // 记录api名字
-              ast.scope.rename(node.local.name)
-              invokedApis.set(propertyName, node.local.name)
-            } else { // 如果是未实现的api 改成Taro.xxx
-              needDefault = true
-              const localName = node.local.name
-              const binding = ast.scope.getBinding(localName)
-              binding && binding.referencePaths.forEach(reference => {
-                reference.replaceWith(
-                  t.memberExpression(
-                    t.identifier(taroName),
-                    t.identifier(propertyName)
-                  )
-                )
-              })
-            }
+          referrencedTaros.forEach(node => {
+            node.name = taroName
           })
 
           ast.traverse({