💻

• Would you like to work on a fix?

How are you using Babel?

Other (Next.js, Gatsby, vue-cli, ...)

Input code

I using Babel standalone with React. I can't import same js name component (different URL).

...
<script src='src/lib/react/17.0.2/react.production.min.js'></script>
<script src='src/lib/react-dom/17.0.2/react-dom.production.min.js'></script>
<script src='src/lib/react-router-dom/5.2.0/react-router-dom.min.js'></script>
<script src='src/lib/babel/standalone/7.15.3/babel.min.js'></script>
...
<script>
    Babel.registerPreset("config-preset", {
        presets: [
            [Babel.availablePresets["es2017"], { modules: true }],
            [Babel.availablePresets["react"]]
        ],
        plugins: [
            [Babel.availablePlugins["transform-modules-umd"]]
        ]
    });
</script>
...
<script type="text/babel" data-presets="config-preset" src="src/pages/Home/index.js"></script>
<script type="text/babel" data-presets="config-preset" src="src/pages/Login/index.js"></script>
...
<script type="text/babel" data-presets="config-preset" src="src/routes/index.js"></script>
...

routes-index.js

import Home from "../pages/Home/index.js";
import Login from "../pages/Login/index.js";

I using console.log(<Home />) and console.log(<Login />) and see Babel generate by name of JS file. So, if I import components with same name, babel will generate index.Home, index2.Login => ERROR.
I must change file name to fix this case

<script type="text/babel" data-presets="config-preset" src="src/pages/Home/pages-home-index.js"></script>
<script type="text/babel" data-presets="config-preset" src="src/pages/Login/pages-login-index.js"></script>

routes-index.js

import Home from "../pages/Home/pages-home-index.js";
import Login from "../pages/Login/pages-login-index.js";

I think you need change the way to generate import file, and it's better if I have some config to auto import index.js (I want to babel auto check and find index.js <script type="text/babel" data-presets="config-preset" src="src/pages/Home/index.js"></script> => <script type="text/babel" data-presets="config-preset" src="src/pages/Home"></script>

Thank you a lot.

Configuration file name

No response

Configuration

No response

Current and expected behavior

I want to import without error

import Home from "../pages/Home/index.js";
import Login from "../pages/Login/index.js";

Environment

Babel standalone version 7.15.3

Possible solution

Change the way to generate import object (full url instead only file name)

It's better if you add feature allow config auto import index.js if find url fail or alway find index.js if suffix isn't js file

Additional context

No response