Not compatible with babel-plugin-transform-imports

[joncursi]

I want to use this module along with babel-plugin-transform-imports so that I can map both internal and external import paths. However, this plugin causes babel-plugin-transform-imports to stop functioning.

E.g.:

    [
      'babel-plugin-root-import',
      {
        rootPathPrefix: '~',
        rootPathSuffix: './src',
      },
    ],
    [
      'babel-plugin-transform-imports',
      {
        '~/components': {
          preventFullImport: true,
          transform: '~/components/${member}',
        },
        '@material-ui/core': {
          preventFullImport: true,
          transform: '@material-ui/core/${member}',
        },
        lodash: {
          preventFullImport: true,
          transform: 'lodash/${member}',
        },
    ],

In the built files, ~ is appropriately mapped for internal modules, however it is as if babel-plugin-transform-imports never ran (built files are still using named imports).

[enigma1]

Have you tried changing the plugins order? Having the babel-plugin-transform-imports first.

[aquintiliano]

I am doing something similar here and also getting the problem, but I'm using @babel/plugin-transform-react-jsx instead

my code:

  {
    "plugins": [
      [
        "@babel/plugin-transform-react-jsx",
        {
          "runtime": "automatic",
          "importSource": "#/runtime"
        }
      ],
      [
        "babel-plugin-root-import", 
        {
          "paths": [
            {
              "rootPathSuffix": "./src",
              "rootPathPrefix": "~/"
            },
            {
              "rootPathSuffix": "./",
              "rootPathPrefix": "#/"
            }
          ]
        }
      ]
    ]
  }

I already tried inverting the order

but on final file, it tries to import from #/runtime instead of ../../runtime