facebook / facebook/stylex

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

Open
#211 5 comments 0 reactions 1 assignee Claimed by @purohitdheeraj View on GitHub
enhancement good first issue
Dominant language
JavaScript
Stars
10.3k
Forks
481
Avg merge
3d 8h
Merged PRs (30d)
13

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.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.