fix(babel-plugin-transform-taroapi): 修复了页面中存在重命名api时编译报错的问题, fix #4024

NervJS · Aug 5, 2019 · 6e7f2ab · 6e7f2ab
1 parent 5e0cb12
commit 6e7f2ab
Show file tree

Hide file tree

Showing 3 changed files with 53 additions and 25 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
@@ -56,9 +56,16 @@ import Taro from '@tarojs/taro-h5';
 console.log(Taro);"
 `;
 
+exports[`should support rename of imported names 1`] = `
+"
+// import { inject as mobxInject, observer as mobxObserver } from '@tarojs/mobx'
+import Taro from \\"@tarojs/taro-h5\\";
+export class Connected extends Taro.Component {}"
+`;
+
 exports[`should work! 1`] = `
 "
-import Taro, { setStorage as _setStorage, getStorage as _getStorage } from '@tarojs/taro-h5';
+import Taro, { getStorage as _getStorage, setStorage as _setStorage } from '@tarojs/taro-h5';
 Taro.initPxTransform(Taro.param);
 Taro.initPxTransform();
 Taro.initPxTransform();

diff --git a/packages/babel-plugin-transform-taroapi/src/__tests__/index-test.ts b/packages/babel-plugin-transform-taroapi/src/__tests__/index-test.ts
@@ -134,7 +134,6 @@ it('should preserve default imports', function () {
   expect(result.code).toMatchSnapshot();
 })
 
-
 it('should preserve assignments in lefthands', function () {
   const code = `
     import Taro from '@tarojs/taro-h5'
@@ -152,3 +151,13 @@ it('should preserve assignments in lefthands', function () {
   const result = babel.transform(code, { plugins: [pluginOptions] })
   expect(result.code).toMatchSnapshot();
 })
+
+it('should support rename of imported names', function () {
+  const code = `
+  // import { inject as mobxInject, observer as mobxObserver } from '@tarojs/mobx'
+  import { Component as TaroComponent } from "@tarojs/taro-h5";
+  export class Connected extends TaroComponent {}
+  `
+  const result = babel.transform(code, { plugins: [pluginOptions] })
+  expect(result.code).toMatchSnapshot();
+})
diff --git a/packages/babel-plugin-transform-taroapi/src/index.ts b/packages/babel-plugin-transform-taroapi/src/index.ts
@@ -4,45 +4,32 @@ const plugin = function (babel: {
   types: typeof Types;
 }): PluginObj {
   const t = babel.types
-
+  
   // 这些变量需要在每个programe里重置
-  let taroName: string = ''
-  let needDefault = false
   const invokedApis: Map<string, string> = new Map()
+  let taroName: string
+  let needDefault: boolean
+
+  let namedImports: Types.ImportSpecifier[]
 
   return {
     name: 'babel-plugin-transform-taro-api',
     visitor: {
       ImportDeclaration (ast, state) {
-        const apis = state.opts.apis
         const packageName = state.opts.packageName
         if (ast.node.source.value !== packageName) return
 
-        taroName = 'Taro'
         ast.node.specifiers.forEach(node => {
           if (t.isImportDefaultSpecifier(node)) {
-            taroName = node.local.name
             needDefault = true
+            taroName = node.local.name
           } else if (t.isImportSpecifier(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
-              const binding = ast.scope.getBinding(propertyName)!
-              binding.referencePaths.forEach(reference => {
-                reference.replaceWith(
-                  t.memberExpression(
-                    t.identifier(taroName),
-                    t.identifier(propertyName)
-                  )
-                )
-              })
-            }
+            namedImports.push(node)
           }
         })
       },
       MemberExpression (ast, state) {
+        /* 处理Taro.xxx */
         const apis = state.opts.apis
         const isTaro = t.isIdentifier(ast.node.object, { name: taroName })
         const property = ast.node.property
@@ -81,14 +68,39 @@ const plugin = function (babel: {
         }
       },
       Program: {
-        enter (ast, state) {
-          taroName = ''
+        enter (ast) {
           needDefault = false
+          namedImports = []
           invokedApis.clear()
+
+          taroName = ast.scope.getBinding('Taro')
+            ? ast.scope.generateUid('Taro')
+            : 'Taro'
         },
         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)
+                  )
+                )
+              })
+            }
+          })
 
           ast.traverse({
             ImportDeclaration (ast) {