facebook/idx

@babel/typescript support

Closed this issue · 3 comments

r4j4h commented

Hi there,

I am working on a project that is compiling TypeScript through Babel using @babel/typescript preset and when I try to use idx I appear to run into an issue with the babel stage and I believe it is similar to #72 in that idx is being fed TypeScript AST and gets confused.

I could be wrong! I've only done some cursory debugging by adding some console.log's before the error message to see why it was hitting the else case every time.

Minimal babel config:

{
    presets: [
        [
            "@babel/preset-env",
            {
                targets: {
                    node: "current",
                },
            },
        ],
        "@babel/typescript",
    ],
    plugins: [
        "babel-plugin-idx"
    ],
};

dummy type:

interface MainArgs {
  QUICK_MODE?: boolean
}
const defaultArgs {
 QUICK_MODE: false
}
  
function dummy(mainArgs: MainArgs) {
let args = {
  ...defaultArgs
  ...mainArgs
};
const QUICK_MODE = idx(mainArgs, a => a.QUICK_MODE!)!;

I've tried various permutations with the TypeScript non-null assertion and nothing helps.

Here's the error (with mismatched line numbers)


ERROR in ./src/dummy.ts
Module build failed (from ./node_modules/babel-loader/lib/index.js):
SyntaxError: /tmp/w/dummy/src/dummy.ts: idx callbacks may only access properties on the callback parameter.
  137 |         // ...code
  138 |         
> 139 |         const QUICK_MODE = idx(mainArgs, a => a.QUICK_MODE!)!;
      |                                               ^
  140 |         await this.cleanup(QUICK_MODE);
  141 | 
    at File.buildCodeFrameError (/tmp/w/dummy/node_modules/@babel/core/lib/transformation/file/file.js:261:12)
    at makeChain (/tmp/w/dummy/node_modules/babel-plugin-idx/lib/babel-plugin-idx.js:92:24)
    at visitIdxCallExpression (/tmp/w/dummy/node_modules/babel-plugin-idx/lib/babel-plugin-idx.js:100:23)
    at /tmp/w/dummy/node_modules/babel-plugin-idx/lib/babel-plugin-idx.js:149:11
    at Array.forEach (<anonymous>)
    at Object.ImportDeclarationVariableDeclarator (/tmp/w/dummy/node_modules/babel-plugin-idx/lib/babel-plugin-idx.js:145:51)
    at NodePath._call (/tmp/w/dummy/node_modules/@babel/traverse/lib/path/context.js:53:20)
    at NodePath.call (/tmp/w/dummy/node_modules/@babel/traverse/lib/path/context.js:40:17)
    at NodePath.visit (/tmp/w/dummy/node_modules/@babel/traverse/lib/path/context.js:88:12)
    at TraversalContext.visitQueue (/tmp/w/dummy/node_modules/@babel/traverse/lib/context.js:118:16)
    at TraversalContext.visitMultiple (/tmp/w/dummy/node_modules/@babel/traverse/lib/context.js:85:17)
    at TraversalContext.visit (/tmp/w/dummy/node_modules/@babel/traverse/lib/context.js:144:19)
    at Function.traverse.node (/tmp/w/dummy/node_modules/@babel/traverse/lib/index.js:94:17)
    at traverse (/tmp/w/dummy/node_modules/@babel/traverse/lib/index.js:76:12)
    at NodePath.traverse (/tmp/w/dummy/node_modules/@babel/traverse/lib/path/index.js:161:24)
    at PluginPass.Program (/tmp/w/dummy/node_modules/babel-plugin-idx/lib/babel-plugin-idx.js:173:16)
    at newFn (/tmp/w/dummy/node_modules/@babel/traverse/lib/visitors.js:193:21)
    at NodePath._call (/tmp/w/dummy/node_modules/@babel/traverse/lib/path/context.js:53:20)
    at NodePath.call (/tmp/w/dummy/node_modules/@babel/traverse/lib/path/context.js:40:17)
    at NodePath.visit (/tmp/w/dummy/node_modules/@babel/traverse/lib/path/context.js:88:12)
    at TraversalContext.visitQueue (/tmp/w/dummy/node_modules/@babel/traverse/lib/context.js:118:16)
    at TraversalContext.visitSingle (/tmp/w/dummy/node_modules/@babel/traverse/lib/context.js:90:19)
    at TraversalContext.visit (/tmp/w/dummy/node_modules/@babel/traverse/lib/context.js:146:19)
    at Function.traverse.node (/tmp/w/dummy/node_modules/@babel/traverse/lib/index.js:94:17)
    at traverse (/tmp/w/dummy/node_modules/@babel/traverse/lib/index.js:76:12)
    at transformFile (/tmp/w/dummy/node_modules/@babel/core/lib/transformation/index.js:88:29)
    at runSync (/tmp/w/dummy/node_modules/@babel/core/lib/transformation/index.js:45:3)
    at runAsync (/tmp/w/dummy/node_modules/@babel/core/lib/transformation/index.js:35:14)
    at process.nextTick (/tmp/w/dummy/node_modules/@babel/core/lib/transform.js:34:34)
    at process._tickCallback (internal/process/next_tick.js:61:11)
 @ ./src/index.ts 34:0-66 35:35-57
mohsen1 commented

Don't you need @babel/plugin-transform-typescript plugin for TypeScript syntax to work?

yungsters commented

Closing because this was opened and last updated almost 2 years ago.