Skip to content

[Good First Issue] Handle absolute paths for alternate inject source #211

Open
@nmn

Description

A relatively easy task to get started

For anyone looking to make a contribution to the core Babel plugin, this is a small self-contained task.

Background

By default, when runtimeInjection is true, the function inject styles at runtime is imported as the default import from '@stylexjs/stylex/lib/stylex-inject'.

A recent change has added support for string and objects to be used as the value of runtimeInjection as well.

  • A string is used as the alternate import source for the inject function.
  • An object of the form {from: string, as: string} can be used for a named import from a custom source.

Current behaviour

Today, any custom import source for the inject function is used as a literal string. This doesn't work well when relative file paths are needed which will be different in each file in a project.

Expected Change

The StateManager class should be updated to detect relative or absolute paths and automatically generate the relative paths necessary from the file being transformed.

Here are the steps involved:

  1. If the file is a relative file path. (Starts with ./ or ../)
    • Convert to an absolute file path by path.join with the rootDir passed in.
  2. Update the get runtimeInjection() getter function in state-manager.js to automatically convert any absolute file paths to relative file paths from the current file.
    • NOTE: Absolute file paths start with / on Unix systems, but may start with C:\\ on Windows.

Stretch Goal: The same fix should also be made for importSources.

The importSources option can also accept custom import paths. However, in this case, existing imports need to be verified as coming from a given location.

Metadata

Labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions