The "root" config option does not seem to work

[cbdeveloper]

I couldn't make the root option work.

Here is my project structure.

ROOT
> cloudRun
  > distApp          // TRANSPILED APP FILES FROM ./src
  > distService      // TRANSPILED BACKEND FILES FROM ./cloudRun/src
  > src              // SOURCE FILES FOR THE BACKEND CODE
      index.js       // INDEX.JS FOR THE BACKEND CODE
  package.json       // PACKAGE.JSON FOR THE BACKEND CODE
  babel.config.js    // CONFIG FOR THE BABEL TRANSPILE SCRIPT
> src                // SOURCE FILES FOR THE APP
    index.js         // INDEX.JS FOR THE APP CODE
package.json         // THIS IS THE MAIN PROJECT package.json

I'm running the scripts from the ROOT.

babel src          --out-dir cloudRun/distApp     --config-file ./cloudRun/babel.config.js
babel cloudRun/src --out-dir cloudRun/distService --config-file ./cloudRun/babel.config.js

My goal: both src folders on ./src and ./cloudRun/src use path aliases that should point to the ./distApp folder, which cointains all the transpiled files for the app code.

So I go this on my babel.config.js:

["module-resolver", {
  root: "./cloudRun",
  alias: {
    "@src"        : "./distApp",
    "@constants"  : "./distApp/constants",
    "@hooks"      : "./distApp/hooks",
  }
}]

From the module-resolver #root docs I've read, I think it should be working. But it's not. In fact, I've tried many things for the root property, and it does't even seem to make any different in the resulting paths.

In theory all path aliases from files in ./src and ./cloudRun/src should be converted as if ./cloudRun what the root to resolve those paths, right?

Anyway, I got it to work with this:

["module-resolver", {
  cwd: "packagejson",
  alias: {
    "@src"        : "./distApp",
    "@constants"  : "./distApp/constants",
    "@hooks"      : "./distApp/hooks",
  }
}]

I got rid of the root property and exchanged it to cwd: "packagejson" which, as per the docs:

cwd: By default, the working directory is the one used for the resolver, but you can override it for your project. The custom value packagejson will make the plugin look for the closest package.json based on the file to parse.

Why does it work with the root property?

[jameskerr]

What is the extensions for the files you'd like to be transformed? I'm using typescript and I specifically need to add an "extensions" key to my config. This worked for me:

[
      "module-resolver",
      {
        "root": ["./"],
        "extensions": [".ts", ".tsx"]
      }
    ]

[jameskerr]

It looks like the defaults are [ '.js', '.jsx', '.es', '.es6', '.mjs' ]

[cbdeveloper]

I'm passing it through the babel CLI from my build.sh script.

This is what I'm using: --extensions ".js,.tsx,.ts"

[JakobJingleheimer]

~I couldn't get it to work with alias + cwd either (I always get Error [ERR_MODULE_NOT_FOUND]: Cannot find package).~

Nevermind. It was a problem with babel-register.