How to pass custom transformer to react-native-scripts

The following worked for react-native init projects react-native start server --transformer scalajsTransformer . but react-native-scripts start server --transformer scalajsTransformer is not working :unamused:


var transformer = require('react-native/packager/transformer');

function transform(src, filename, options) {
  options = options || {};
  console.log("fileName : "+ filename);
  if(filename.indexOf('scalajs-output-') > -1) {
  return {
        code: src,
//        map: filename+".map",
  } else {
   return transformer.transform(src,filename,options)


module.exports.transform = transform;

You should be able to do this with the packagerOpts key in app.json

"packagerOpts": {
  "transformer": "scalajsTransformer"
1 Like

@jesse, in this case, how do you identify “scalajsTransformer”? Is it a filename?

Not sure how the React Native packager interprets it, I’d take a look at the docs or source code there. We’re just passing that as an argument to the React Native packager.


I don’t know if you have it done but there is a nice tutorial for typescript and I imagine that you could use it as a example and do something similar.

Basically you have that transformer you @chandu01011 posted and a file rn-cli.config

module.exports = {  
  getTransformModulePath() {
    return require.resolve('react-native-typescript-transformer')
  getSourceExts() {
    return ['ts', 'tsx'];
1 Like


ScalaJS running on Expo:

1 Like