Compile TypeScript with react-native-typescript-transformer?

Question

Since Expo SDK 31 there is TypeScript support integrated. That’s great.

However, as far as I can tell, it uses babel-typescript. For my project, running on Expo SDK 33, I need to use react-native-typescript-transformer instead. Is this possible? How I can configure this change?

PS: The reason I need to use react-native-typescript-transformer is that I need support for TypeScript namespaces and enums. I use swagger-codegen to generate my REST client layer. But all the generators I found use namespaces (and also enums that are not supported either by Babel 7 if I understood well).

score 2 · Accepted Answer · answered Jun 19 '19 at 09:41

Finally figured it out!

Whenever you build and run your React Native project, a packager starts up called Metro. The packager does a few things, including: combining all your Javascript code into a single file, and translates any Javascript code that your device won’t understand - like JSX and TypeScript (credits to mahdi).

To hook up and bypass the babel-typescript using react-native-typescript-transformer simply create a file in your project root directory called metro.config.js. Here's the config:

module.exports = {
    transformer: {
        babelTransformerPath: require.resolve(
            'react-native-typescript-transformer',
        ),
    },
};

Works on Expo SDK 33 with TypeScript 3.4.5. I managed to finally use swagger-codegen to generate my REST client layer!

Compile TypeScript with react-native-typescript-transformer?

1 Answers1