Why does cjs file extension on babel.config break module-resolver?

299 views Asked by At

I have created a minimal reproducable example with a detailed README here.

In my expo app, I was having trouble using the babel module-resolver to use path aliases. My Metro bundling would fail when I used path aliases.

I learned that when I changed my babel.config file extension from .cjs to .js, the problem was resolved.

However, I do not understand why that would have any effect on whether the module-resolver plugin would work.

As described on babel's documentation, "Babel can be configured using any file extension natively supported by Node.js", with cjs specifically enumerated. And as I understand it, Expo by default creates a CommonJS babel.config file as it uses module.exports.

I have never created a GitHub issue, but perhaps this question is better suited as a babel-plugin-module-resolver issue, or I need to narrow down this issue further to determine whether Expo, or other babel plugins are relevant.

In short:

I tried creating a new expo app with npx create-expo-app to see if something about my project was effecting this issue. I then added a path alias to a test component and imported the component with the path alias. I ran expo which resulted in a bundle success. I then renamed babel.config.cjs and ran expo again with --clear, which resulted in a bundle failure "Unable to resolve [path alias]..."

I expected the cjs file extension to have no effect on whether the module-resolver caused an error.

What resulted was the module-resolver being fixed once I renamed babel.config.cjs to babel.config.js

0

There are 0 answers