Skip to content

Allow aliased and absolute imports #1

@Sheraff

Description

@Sheraff

Currently we only support relative paths in import(), but the only reason for this is because I'm lazy. Since it happens at build time, let's just throw a package at it.

The path resolution happens here (just before readFileSync) and it's just some regular Node.js functions, nothing fancy. Also importeeRelativePath is not necessarily relative, it's whatever we find as the first argument of import().

function readImportee(importerAbsolutePath, importeeRelativePath, state, parentPath) {
const directory = nodePath.dirname(importerAbsolutePath)
const fileAbsolutePath = nodePath.join(directory, importeeRelativePath)
const codeString = fs.readFileSync(fileAbsolutePath, {encoding: 'utf8'})
const ast = parser.parse(codeString, {
sourceType: 'module',
plugins: ['jsx'],
})
traverse(ast, ExtractHooksFromImporteeVisitor, undefined, state, parentPath);
}

Maybe look into this babel-plugin-module-resolver package?

Basic of paths we need to support:

  • ./folder/file.jsx relative
  • /folder/file.jsx absolute from project root
  • ./folder/name without extension, can mean name.js, name.jsx, name/index.js, ...

And also aliased modules:

  • some-module/file.jsx aliased from node_modules
  • @alias/file.jsx aliased from project config

If we're to support aliased imports, we'll need to get a pointer to a config file passed as an option, like a webpack.config.js or a .babelrc.js

Metadata

Metadata

Assignees

No one assigned

    Labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions