feat: Add support for new ES dynamic import() (#143)

Author: leoselig

package.json

@@ -39,6 +39,7 @@
     "babel-cli": "^6.24.0",
     "babel-core": "^6.24.0",
     "babel-jest": "^19.0.0",
+    "babel-plugin-syntax-dynamic-import": "^6.18.0",
     "babel-plugin-transform-es2015-modules-commonjs": "^6.24.0",
     "babel-plugin-transform-object-rest-spread": "^6.23.0",
     "babel-preset-env": "^1.2.2",

src/transformers/call.js

@@ -1,4 +1,8 @@
-import { matchesPattern, mapPathString } from '../utils';
+import {
+  matchesPattern,
+  mapPathString,
+  isImportCall,
+} from '../utils';
 
 
 const patterns = [
@@ -14,8 +18,9 @@ const patterns = [
 
 export default function transformCall(nodePath, state) {
   const calleePath = nodePath.get('callee');
+  const isNormalCall = patterns.some(pattern => matchesPattern(state.types, calleePath, pattern));
 
-  if (patterns.some(pattern => matchesPattern(state.types, calleePath, pattern))) {
+  if (isNormalCall || isImportCall(state.types, nodePath)) {
     mapPathString(nodePath.get('arguments.0'), state);
   }
 }

src/utils.js

@@ -53,3 +53,7 @@ export function mapPathString(nodePath, state) {
     nodePath.replaceWith(state.types.stringLiteral(modulePath));
   }
 }
+
+export function isImportCall(types, calleePath) {
+  return types.isImport(calleePath.node.callee);
+}

test/dynamicImport.test.js

@@ -0,0 +1,59 @@
+/* eslint-env jest */
+import { transform } from 'babel-core'; // eslint-disable-line import/no-extraneous-dependencies
+import plugin from '../src';
+
+// According to https://github.com/tc39/proposal-dynamic-import
+
+describe('import()', () => {
+  const transformerOpts = {
+    babelrc: false,
+    plugins: [
+      // We need to add the corresponding syntax plugin
+      // in order to parse the `import()`-calls
+      'syntax-dynamic-import',
+      [plugin, {
+        root: [
+          './test/testproject/src',
+        ],
+        alias: {
+          test: './test/testproject/test',
+        },
+      }],
+    ],
+  };
+
+  it('should resolve the path based on the root config', () => {
+    const code = 'import("app").then(() => {}).catch(() => {});';
+    const result = transform(code, transformerOpts);
+
+    expect(result.code).toBe('import("./test/testproject/src/app").then(() => {}).catch(() => {});');
+  });
+
+  it('should alias the path', () => {
+    const code = 'import("test/tools").then(() => {}).catch(() => {});';
+    const result = transform(code, transformerOpts);
+
+    expect(result.code).toBe('import("./test/testproject/test/tools").then(() => {}).catch(() => {});');
+  });
+
+  it('should not change the path', () => {
+    const code = 'import("./something").then(() => {}).catch(() => {});';
+    const result = transform(code, transformerOpts);
+
+    expect(result.code).toBe('import("./something").then(() => {}).catch(() => {});');
+  });
+
+  it('should handle the first argument not being a string literal', () => {
+    const code = 'import(path).then(() => {}).catch(() => {});';
+    const result = transform(code, transformerOpts);
+
+    expect(result.code).toBe('import(path).then(() => {}).catch(() => {});');
+  });
+
+  it('should handle an empty path', () => {
+    const code = 'import("").then(() => {}).catch(() => {});';
+    const result = transform(code, transformerOpts);
+
+    expect(result.code).toBe('import("").then(() => {}).catch(() => {});');
+  });
+});