Skip to content

fix(rspeedy/react): use React from rootPath#275

Merged
colinaaa merged 2 commits intolynx-family:mainfrom
colinaaa:colin/0321/include
Mar 21, 2025
Merged

fix(rspeedy/react): use React from rootPath#275
colinaaa merged 2 commits intolynx-family:mainfrom
colinaaa:colin/0321/include

Conversation

@colinaaa
Copy link
Collaborator

@colinaaa colinaaa commented Mar 21, 2025

Summary

The react set in the source.include is not correct when using canary version.

lynx-stack/packages/rspeedy/plugin-react/src/pluginReactLynx.ts

Lines 365 to 371 in 33a64cf

config = mergeRsbuildConfig(config, {
source: {
include: [
path.dirname(require.resolve('@lynx-js/react/package.json')),
],
},
})

We should use require.resolve from rootPath just like aliases does.

Checklist

  • Tests updated (or not required).
  • Documentation updated (or not required).

@changeset-bot
Copy link

changeset-bot bot commented Mar 21, 2025 •
edited
Loading

🦋 Changeset detected

Latest commit: 945fc3e

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 2 packages
Name Type
@lynx-js/react-alias-rsbuild-plugin Patch
@lynx-js/react-rsbuild-plugin Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@codecov
Copy link

codecov bot commented Mar 21, 2025 •
edited
Loading

Codecov Report

All modified and coverable lines are covered by tests ✅

✅ All tests successful. No failed tests found.

📢 Thoughts on this report? Let us know!

@hzy hzy added this pull request to the merge queue Mar 21, 2025
github-merge-queue bot pushed a commit that referenced this pull request Mar 21, 2025
@colinaaa
fix(rspeedy/react): use React from rootPath (#275)
d2ef64a 
<!--
  Thank you for submitting a pull request!

We appreciate the time and effort you have invested in making these
changes. Please ensure that you provide enough information to allow
others to review your pull request.

Upon submission, your pull request will be automatically assigned with
reviewers.

If you want to learn more about contributing to this project, please
visit:
https://github.com/lynx-family/lynx-stack/blob/main/CONTRIBUTING.md.
-->

## Summary

<!-- Can you explain the reasoning behind implementing this change? What
problem or issue does this pull request resolve? -->

The react set in the `source.include` is not correct when using canary
version.


https://github.com/lynx-family/lynx-stack/blob/33a64cffba578bba9240eb491d5886e1e41467b9/packages/rspeedy/plugin-react/src/pluginReactLynx.ts#L365-L371

We should use `require.resolve` from `rootPath` just like aliases does.

<!-- It would be helpful if you could provide any relevant context, such
as GitHub issues or related discussions. -->

## Checklist

<!--- Check and mark with an "x" -->

- [x] **Tests updated** (or not required).
- [x] Documentation updated (or **not required**).
@github-merge-queue github-merge-queue bot removed this pull request from the merge queue due to failed status checks Mar 21, 2025
@colinaaa colinaaa added this pull request to the merge queue Mar 21, 2025
Merged via the queue into lynx-family:main with commit 6af0396 Mar 21, 2025
16 checks passed
@colinaaa colinaaa deleted the colin/0321/include branch March 21, 2025 16:23
@github-actions github-actions bot mentioned this pull request Mar 21, 2025
Merged
colinaaa pushed a commit that referenced this pull request Mar 22, 2025
@github-actions
chore: Release 2025-03-21 16:30:09 (#242)
5bfb5c0 
This PR was opened by the [Changesets
release](https://github.com/changesets/action) GitHub action. When
you're ready to do a release, you can merge this and the packages will
be published to npm automatically. If you're not ready to do a release
yet, that's fine, whenever you add more changesets to main, this PR will
be updated.


# Releases
## @lynx-js/react@0.106.0

### Minor Changes

- Improved rendering performance by batching updates sent to the main
thread in a single render pass. This optimization reduces redundant
layout operations on the main thread, accelerates rendering, and
prevents screen flickering.
([#239](#239))

**BREAKING CHANGE**: This commit changes the behavior of Timing API.
Previously, timing events were fired for each update individually. With
the new batching mechanism, timing events related to the rendering
pipeline will now be triggered once per render cycle rather than for
each individual update, affecting applications that rely on the previous
timing behavior.

### Patch Changes

- Add missing typing for `useErrorBoundary`.
([#263](#263))

    You can now use `useErrorBoundary` it in TypeScript like this:

    ```tsx
    import { useErrorBoundary } from "@lynx-js/react";
    ```

- Modified the format of data sent from background threads to the main
thread. ([#207](#207))

- Support Lynx SSR.
([#60](#60))

## @lynx-js/web-constants@0.9.0

### Minor Changes

- refractor: remove entryId concept
([#217](#217))

    After the PR #198
    All contents are isolated by a shadowroot.
Therefore we don't need to add the entryId selector to avoid the
lynx-view's style taking effect on the whole page.

### Patch Changes

- feat: `nativeModulesUrl` of lynx-view is changed to
`nativeModulesMap`, and the usage is completely aligned with
`napiModulesMap`.
([#220](#220))

    "warning: This is a breaking change."

`nativeModulesMap` will be a map: key is module-name, value should be a
esm url which export default a
    function with two parameters(you never need to use `this`):

- `NativeModules`: oriented `NativeModules`, which you can use to call
        other Native-Modules.

- `NativeModulesCall`: trigger `onNativeModulesCall`, same as the
deprecated `this.nativeModulesCall`.

    example:

    ```js
    const nativeModulesMap = {
      CustomModule: URL.createObjectURL(
        new Blob(
          [
            `export default function(NativeModules, NativeModulesCall) {
        return {
          async getColor(data, callback) {
            const color = await NativeModulesCall('getColor', data);
            callback(color);
          },
        }
      };`,
          ],
          { type: "text/javascript" }
        )
      ),
    };
    lynxView.nativeModulesMap = nativeModulesMap;
    ```

In addition, we will use Promise.all to load `nativeModules`, which will
optimize performance in the case of multiple modules.

- refactor: clean the decodeOperations implementation
([#261](#261))

- refactor: remove customelement defined detecting logic
([#247](#247))

Before this commit, for those element with tag without `-`, we always
try to detect if the `x-${tagName}` is defined.

After this commit, we pre-define a map(could be override by the
`overrideLynxTagToHTMLTagMap`) to make that transformation for tag name.

    This change is a path to SSR and the MTS support.

- Updated dependencies
\[[`53230f0`](53230f0)]:
    -   @lynx-js/web-worker-rpc@0.9.0

## @lynx-js/web-core@0.9.0

### Minor Changes

- feat: `nativeModulesUrl` of lynx-view is changed to
`nativeModulesMap`, and the usage is completely aligned with
`napiModulesMap`.
([#220](#220))

    "warning: This is a breaking change."

`nativeModulesMap` will be a map: key is module-name, value should be a
esm url which export default a
    function with two parameters(you never need to use `this`):

- `NativeModules`: oriented `NativeModules`, which you can use to call
        other Native-Modules.

- `NativeModulesCall`: trigger `onNativeModulesCall`, same as the
deprecated `this.nativeModulesCall`.

    example:

    ```js
    const nativeModulesMap = {
      CustomModule: URL.createObjectURL(
        new Blob(
          [
            `export default function(NativeModules, NativeModulesCall) {
        return {
          async getColor(data, callback) {
            const color = await NativeModulesCall('getColor', data);
            callback(color);
          },
        }
      };`,
          ],
          { type: "text/javascript" }
        )
      ),
    };
    lynxView.nativeModulesMap = nativeModulesMap;
    ```

In addition, we will use Promise.all to load `nativeModules`, which will
optimize performance in the case of multiple modules.

- refractor: remove entryId concept
([#217](#217))

    After the PR #198
    All contents are isolated by a shadowroot.
Therefore we don't need to add the entryId selector to avoid the
lynx-view's style taking effect on the whole page.

### Patch Changes

- refactor: code clean
([#266](#266))

- refactor: clean the decodeOperations implementation
([#261](#261))

- fix: When the width and height of lynx-view are not auto, the width
and height of the `lynx-tag="page"` need to be correctly set to 100%.
([#228](#228))

- refactor: remove customelement defined detecting logic
([#247](#247))

Before this commit, for those element with tag without `-`, we always
try to detect if the `x-${tagName}` is defined.

After this commit, we pre-define a map(could be override by the
`overrideLynxTagToHTMLTagMap`) to make that transformation for tag name.

    This change is a path to SSR and the MTS support.

- fix: 'error' event for main-thread \_reportError
([#283](#283))

- Updated dependencies
\[[`5b5e090`](5b5e090),
[`b844e75`](b844e75),
[`53230f0`](53230f0),
[`6f16827`](6f16827),
[`d2d55ef`](d2d55ef)]:
    -   @lynx-js/web-worker-runtime@0.9.0
    -   @lynx-js/web-constants@0.9.0
    -   @lynx-js/web-worker-rpc@0.9.0

## @lynx-js/web-elements@0.5.0

### Minor Changes

- feat: 1. list adds support for the `sticky` attribute. Now
sticky-offset, sticky-top, and sticky-bottom will only take effect when
`sticky` is `true`.
([#257](#257))

    2.  Added support for `list-main-axis-gap`, `list-cross-axis-gap`.

- feat(web): The list element supports list-type with **flow**.
([#240](#240))

It supports all attributes and events under single, and also provides
`full-span`.

    For detailed usage, please refer to the official website.

## @lynx-js/web-mainthread-apis@0.9.0

### Minor Changes

- refractor: remove entryId concept
([#217](#217))

    After the PR #198
    All contents are isolated by a shadowroot.
Therefore we don't need to add the entryId selector to avoid the
lynx-view's style taking effect on the whole page.

### Patch Changes

- refactor: clean the decodeOperations implementation
([#261](#261))

- refactor: remove customelement defined detecting logic
([#247](#247))

Before this commit, for those element with tag without `-`, we always
try to detect if the `x-${tagName}` is defined.

After this commit, we pre-define a map(could be override by the
`overrideLynxTagToHTMLTagMap`) to make that transformation for tag name.

    This change is a path to SSR and the MTS support.

- Updated dependencies
\[[`5b5e090`](5b5e090),
[`f447811`](f447811),
[`b844e75`](b844e75),
[`6f16827`](6f16827),
[`d2d55ef`](d2d55ef)]:
    -   @lynx-js/web-constants@0.9.0
    -   @lynx-js/web-style-transformer@0.2.3

## @lynx-js/web-worker-runtime@0.9.0

### Minor Changes

- feat: `nativeModulesUrl` of lynx-view is changed to
`nativeModulesMap`, and the usage is completely aligned with
`napiModulesMap`.
([#220](#220))

    "warning: This is a breaking change."

`nativeModulesMap` will be a map: key is module-name, value should be a
esm url which export default a
    function with two parameters(you never need to use `this`):

- `NativeModules`: oriented `NativeModules`, which you can use to call
        other Native-Modules.

- `NativeModulesCall`: trigger `onNativeModulesCall`, same as the
deprecated `this.nativeModulesCall`.

    example:

    ```js
    const nativeModulesMap = {
      CustomModule: URL.createObjectURL(
        new Blob(
          [
            `export default function(NativeModules, NativeModulesCall) {
        return {
          async getColor(data, callback) {
            const color = await NativeModulesCall('getColor', data);
            callback(color);
          },
        }
      };`,
          ],
          { type: "text/javascript" }
        )
      ),
    };
    lynxView.nativeModulesMap = nativeModulesMap;
    ```

In addition, we will use Promise.all to load `nativeModules`, which will
optimize performance in the case of multiple modules.

- refractor: remove entryId concept
([#217](#217))

    After the PR #198
    All contents are isolated by a shadowroot.
Therefore we don't need to add the entryId selector to avoid the
lynx-view's style taking effect on the whole page.

### Patch Changes

- refactor: remove customelement defined detecting logic
([#247](#247))

Before this commit, for those element with tag without `-`, we always
try to detect if the `x-${tagName}` is defined.

After this commit, we pre-define a map(could be override by the
`overrideLynxTagToHTMLTagMap`) to make that transformation for tag name.

    This change is a path to SSR and the MTS support.

- Updated dependencies
\[[`5b5e090`](5b5e090),
[`b844e75`](b844e75),
[`53230f0`](53230f0),
[`6f16827`](6f16827),
[`d2d55ef`](d2d55ef)]:
    -   @lynx-js/web-constants@0.9.0
    -   @lynx-js/web-mainthread-apis@0.9.0
    -   @lynx-js/web-worker-rpc@0.9.0

## @lynx-js/rspeedy@0.8.5

### Patch Changes

- Bump Rsdoctor v1.0.0.
([#250](#250))

## @lynx-js/react-rsbuild-plugin@0.9.3

### Patch Changes

- Support `@lynx-js/react` v0.106.0.
([#239](#239))

- Fix the issue where the canary version of React was not included in
the `rule.include` configuration.
([#275](#275))

- Updated dependencies
\[[`ba26a4d`](ba26a4d),
[`462e97b`](462e97b),
[`aa1fbed`](aa1fbed),
[`d2d55ef`](d2d55ef),
[`6af0396`](6af0396)]:
    -   @lynx-js/template-webpack-plugin@0.6.6
    -   @lynx-js/react-webpack-plugin@0.6.9
    -   @lynx-js/runtime-wrapper-webpack-plugin@0.0.9
    -   @lynx-js/web-webpack-plugin@0.6.3
    -   @lynx-js/react-alias-rsbuild-plugin@0.9.3
    -   @lynx-js/css-extract-webpack-plugin@0.5.2
    -   @lynx-js/react-refresh-webpack-plugin@0.3.2

## @lynx-js/react-alias-rsbuild-plugin@0.9.3

### Patch Changes

- Fix the issue where the canary version of React was not included in
the `rule.include` configuration.
([#275](#275))

## @lynx-js/web-style-transformer@0.2.3

### Patch Changes

- feat: 1. list adds support for the `sticky` attribute. Now
sticky-offset, sticky-top, and sticky-bottom will only take effect when
`sticky` is `true`.
([#257](#257))

    2.  Added support for `list-main-axis-gap`, `list-cross-axis-gap`.

## @lynx-js/web-worker-rpc@0.9.0

### Patch Changes

- feat: add a new type function RpcCallType
([#283](#283))

## @lynx-js/react-webpack-plugin@0.6.9

### Patch Changes

- Support `@lynx-js/react` v0.106.0.
([#239](#239))

## @lynx-js/runtime-wrapper-webpack-plugin@0.0.9

### Patch Changes

- Add `window` variable to callback argument in `background.js` and the
`window` is `undefined` in Lynx. Sometimes it's useful to distinguish
between Lynx and the Web.
([#248](#248))

    ```js
    define('background.js', (..., window) => {
      console.log(window); // `undefined` in Lynx
    })
    ```

## @lynx-js/template-webpack-plugin@0.6.6

### Patch Changes

- expose main.lynx.bundle to compiler
([#231](#231))

## @lynx-js/web-webpack-plugin@0.6.3

### Patch Changes

- chore: remove unused file
([#217](#217))

- Updated dependencies
\[[`f447811`](f447811)]:
    -   @lynx-js/web-style-transformer@0.2.3

## create-rspeedy@0.8.5



## upgrade-rspeedy@0.8.5

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@hzy hzy hzy approved these changes

@Yradex Yradex Awaiting requested review from Yradex

@PupilTong PupilTong Awaiting requested review from PupilTong

@gaoachao gaoachao Awaiting requested review from gaoachao

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

2 participants

@colinaaa @hzy