Using the @ Symbol in Javascript ES6 Module Imports

Question

One of the folders in my node_modules directory is called @mymodule, and within it, there is another folder named 'insidefolder'.

The path to this folder looks like this: node_modules/@mymodule/insidefolder

When trying to import insidefolder using ES6 syntax, I encountered an error:

import insidefolder from '@mymodule/insidefolder';

The error message stated:

Error: Cannot find module '../ymodule/insidefolder'

const mymodule = require('@mymodule/insidefolder');

Surprisingly, using the CommonJS syntax worked perfectly fine.

Is there a way to fix this issue?

Answer 1

Answer №1

My issue was due to a configuration in my .babelrc file where I had the following plugin set up:

["babel-root-import", [{
      "rootPathPrefix": "@",
      "rootPathSuffix": "src"
    }]]

As a result, every import starting with @ was directed to the src path. Upon removing this configuration, my problem was resolved.

Answer 2

My issue was due to a configuration in my .babelrc file where I had the following plugin set up:

["babel-root-import", [{
      "rootPathPrefix": "@",
      "rootPathSuffix": "src"
    }]]

As a result, every import starting with @ was directed to the src path. Upon removing this configuration, my problem was resolved.