Babel transpile on Import statement with query string not working as expected

[ask-imran]

Hey everyone,

I have got a react app which uses svg-react-loader and in the import statements that import svg I have a querystring for the componentName. During webpack build the babel loader resolves everything and is working as expected.

But, when I try to run babel transpile via the cli just to transpile the files alone, I end up in a strange behavior,

import MyLogo from 'images/mylogo.svg?name=MyLogo';

I have got resolve set to src in webpack which allows me to provide the above path. but babel transpile results as below,

var _mylogo = require('images/mylogo.svg?name=MyLogo');

my expected output would be,

var _mylogo = require('../images/mylogo.svg?name=MyLogo');

If I remove the query string in the import statement it transpiles to what I expect. with query string it doesn't. Is there a config or something I am missing ? I am also using Module-resolver plugin in babel.

React version : 15.6 Babel version: 6.26.3

[jnleonard3]

We use the same loader for SVGs and I more or less ran into this issue. However, because I double up using this babel plugin along with setting the same Aliases in webpack, this plugin created a lot of noise with the warning message Could not resolve 'alias/file?with=queryParam in path/to/file but was successful because the webpack alias was ultimately used when this plugin didn't transform the import.

Unless someone can think of a reason why properly handling imports with query strings would be the worst thing in the world, knowing that this plugin likely operates in the same space as webpack often enough, I was able to easily get this to work in this PR by separating out the query string before doing the resolve.sync file existance check: #427

[jnleonard3]

If anyone needs this before the PR becomes an official part of this project, I've published it to npm as at least my organization needs this change in the meantime: npm i @jleonardvp/babel-plugin-module-resolver