Skip to content

feat(webpack/chunk-loading)!: chunkLoading: 'lynx' for Rspack#400

Merged
colinaaa merged 5 commits intolynx-family:mainfrom
colinaaa:colin/0330/chunk-loading
Apr 2, 2025
Merged

feat(webpack/chunk-loading)!: chunkLoading: 'lynx' for Rspack#400
colinaaa merged 5 commits intolynx-family:mainfrom
colinaaa:colin/0330/chunk-loading

Conversation

@colinaaa
Copy link
Copy Markdown
Collaborator

@colinaaa colinaaa commented Mar 30, 2025

Summary

This patch deletes the ChunkLoadingRspackPlugin and use ChunkLoadingWebpackPlugin directly in Rspack.

We are doing it now since we have implemented all the APIs needed.

Caution

This is a BREAKING CHANGE since you need to use chunkLoading: 'lynx' instead of chunkLoading: 'require'.

fix: #253 since we do not relay on hooks.runtimeModule which could cause issue.

Checklist

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

@codecov
Copy link
Copy Markdown

codecov bot commented Mar 30, 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!

@codecov
Copy link
Copy Markdown

codecov bot commented Mar 30, 2025 •
edited
Loading

Bundle Report

Changes will increase total bundle size by 71 bytes (0.01%) ⬆️. This is within the configured threshold ✅

Detailed changes
Bundle name Size Change
@lynx-js/example-react-lynx-cjs 236.97kB 71 bytes (0.03%) ⬆️

Affected Assets, Files, and Routes:

view changes for bundle: @lynx-js/example-react-lynx-cjs

Assets Changed:

Asset Name Size Change Total Size Change (%)
main.lynx.bundle 71 bytes 87.72kB 0.08%

@codspeed-hq
Copy link
Copy Markdown

codspeed-hq bot commented Mar 30, 2025 •
edited
Loading

CodSpeed Performance Report

Merging #400 will not alter performance

Comparing colinaaa:colin/0330/chunk-loading (c9cdd7f) with main (2dcb013)

Summary

✅ 1 untouched benchmarks

@colinaaa colinaaa mentioned this pull request Mar 31, 2025
Closed
@changeset-bot
Copy link
Copy Markdown

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

🦋 Changeset detected

Latest commit: c9cdd7f

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

This PR includes changesets to release 4 packages
Name Type
@lynx-js/chunk-loading-webpack-plugin Minor
@lynx-js/rspeedy Patch
create-rspeedy Patch
upgrade-rspeedy 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

@colinaaa colinaaa marked this pull request as ready for review March 31, 2025 14:08
@colinaaa colinaaa self-assigned this Apr 1, 2025
@colinaaa colinaaa added this pull request to the merge queue Apr 2, 2025
Merged via the queue into lynx-family:main with commit df63722 Apr 2, 2025
31 checks passed
@colinaaa colinaaa deleted the colin/0330/chunk-loading branch April 2, 2025 03:55
@github-actions github-actions bot mentioned this pull request Apr 2, 2025
Merged
@colinaaa colinaaa mentioned this pull request Apr 2, 2025
Closed
@tommy141x tommy141x mentioned this pull request Apr 2, 2025
Open
@colinaaa colinaaa mentioned this pull request Apr 2, 2025
Merged
2 tasks
github-merge-queue bot pushed a commit that referenced this pull request Apr 2, 2025
@colinaaa
fix(webpack/css-extract): CSS HMR not working (#456)
3e7988f 
<!--
  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? -->

We do not use `chunkLoading: 'require'` in Rspack after #400. So we need
to change the CSS hot update runtime, too.

This patch avoid using the `compilation.hooks.runtimeModule`, but use
the standard `RuntimeModule`.

Also fix CSS HMR not working when using nested entry.

<!-- 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).
- [ ] Documentation updated (or **not required**).
colinaaa pushed a commit that referenced this pull request Apr 5, 2025
@github-actions
chore: Release 2025-04-05 13:19:16 (#413)
6b210f3 
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/rspeedy@0.9.0

### Minor Changes

- Bundle Rspeedy with Rslib for faster start-up times.
([#395](#395))

This would be a **BREAKING CHANGE** for using [global version of
Rspeedy](https://lynxjs.org/rspeedy/cli#using-the-global-rspeedy-version).

Please ensure that you update your globally installed version of
Rspeedy:

    ```bash
    npm install --global @lynx-js/rspeedy@latest
    ```

- Bump Rsbuild v1.3.2 with Rspack v1.3.1
([#446](#446))

- **BREAKING CHANGE**: Added explicit TypeScript peer dependency
requirement of 5.1.6 - 5.8.x.
([#480](#480))

This formalizes the existing TypeScript version requirement in
`peerDependencies` (marked as optional since it is only needed for
TypeScript configurations). The actual required TypeScript version has
not changed.

Note: This may cause installation to fail if you have strict peer
dependency checks enabled.

Node.js v22.7+ users can bypass TypeScript installation using
`--experimental-transform-types` or `--experimental-strip-types` flags.
Node.js v23.6+ users don't need any flags. See [Node.js -
TypeScript](https://nodejs.org/api/typescript.html) for details.

### Patch Changes

- Support cli flag `--base` to specify the base path of the server.
([#387](#387))

- Support cli option `--environment` to specify the name of environment
to build ([#462](#462))

- Select the most appropriate network interface.
([#457](#457))

This is a port of
[webpack/webpack-dev-server#5411](webpack/webpack-dev-server#5411).

- Support Node.js v23.6+ native TypeScript.
([#481](#481))

See [Node.js - TypeScript](https://nodejs.org/api/typescript.html) for
more details.

- Support cli option `--env-mode` to specify the env mode to load the
`.env.[mode]` file.
([#453](#453))

- Support `dev.hmr` and `dev.liveReload`.
([#458](#458))

- Updated dependencies
\[[`df63722`](df63722),
[`df63722`](df63722)]:
    -   @lynx-js/chunk-loading-webpack-plugin@0.2.0

## @lynx-js/chunk-loading-webpack-plugin@0.2.0

### Minor Changes

- **BREAKING CHANGE**: Requires `@rspack/core` v1.3.0.
([#400](#400))

- **BREAKING CHANGE**: Remove the deprecated `ChunkLoadingRspackPlugin`,
use `ChunkLoadingWebpackPlugin` with `output.chunkLoading: 'lynx'`
instead. ([#400](#400))

    ```js
import { ChunkLoadingWebpackPlugin } from
"@lynx-js/chunk-loading-webpack-plugin";

    export default {
      output: {
        chunkLoading: "lynx",
      },
      plugins: [new ChunkLoadingWebpackPlugin()],
    };
    ```

## @lynx-js/react@0.106.3

### Patch Changes

- Do some global var initialize in hydrate, which fixes error like
`cannot read property '-21' of undefined` and some style issue.
([#461](#461))

- fix: ensure ref lifecycle events run after firstScreen in the
background thread
([#434](#434))

This patch fixes an issue where ref lifecycle events were running before
firstScreen events in the background thread async render mode, which
could cause refs to be undefined when components try to access them.

## @lynx-js/qrcode-rsbuild-plugin@0.3.5

### Patch Changes

- Build with Rslib
([#396](#396))

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

### Patch Changes

- fix: add enableCSSInvalidation for encodeCSS of css HMR, this will fix
pseudo-class (such as `:active`) not working in HMR.
([#435](#435))

- Disable `module.generator.json.JSONParse` option as it increases the
bundle size of `main-thread.js`. For more detail, please see this
[issue](webpack/webpack#19319).
([#402](#402))

- Updated dependencies
\[[`3e7988f`](3e7988f),
[`7243242`](7243242)]:
    -   @lynx-js/css-extract-webpack-plugin@0.5.3
    -   @lynx-js/template-webpack-plugin@0.6.8
    -   @lynx-js/react-alias-rsbuild-plugin@0.9.5
    -   @lynx-js/react-refresh-webpack-plugin@0.3.2
    -   @lynx-js/react-webpack-plugin@0.6.10
    -   @lynx-js/web-webpack-plugin@0.6.3

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

### Patch Changes

- feat: onNapiModulesCall function add new param: `dispatchNapiModules`,
napiModulesMap val add new param: `handleDispatch`.
([#414](#414))

Now you can use them to actively communicate to napiModules (background
thread) in onNapiModulesCall (ui thread).

-   Updated dependencies \[]:
    -   @lynx-js/web-worker-rpc@0.10.1

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

### Patch Changes

- docs: fix documents about lynx-view's properties
([#412](#412))

    Attributes should be hyphen-name: 'init-data', 'global-props'.

    now all properties has corresponding attributes.

- feat: onNapiModulesCall function add new param: `dispatchNapiModules`,
napiModulesMap val add new param: `handleDispatch`.
([#414](#414))

Now you can use them to actively communicate to napiModules (background
thread) in onNapiModulesCall (ui thread).

- Updated dependencies
\[[`1af3b60`](1af3b60)]:
    -   @lynx-js/web-constants@0.10.1
    -   @lynx-js/web-worker-runtime@0.10.1
    -   @lynx-js/web-worker-rpc@0.10.1

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

### Patch Changes

- feat: add `layoutchange` event support for x-view and x-text
([#408](#408))

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

### Patch Changes

- Updated dependencies
\[[`1af3b60`](1af3b60)]:
    -   @lynx-js/web-constants@0.10.1

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

### Patch Changes

- feat: onNapiModulesCall function add new param: `dispatchNapiModules`,
napiModulesMap val add new param: `handleDispatch`.
([#414](#414))

Now you can use them to actively communicate to napiModules (background
thread) in onNapiModulesCall (ui thread).

- Updated dependencies
\[[`1af3b60`](1af3b60)]:
    -   @lynx-js/web-constants@0.10.1
    -   @lynx-js/web-mainthread-apis@0.10.1
    -   @lynx-js/web-worker-rpc@0.10.1

## @lynx-js/css-extract-webpack-plugin@0.5.3

### Patch Changes

- Fix CSS HMR not working with nested entry name.
([#456](#456))

- fix: add enableCSSInvalidation for encodeCSS of css HMR, this will fix
pseudo-class (such as `:active`) not working in HMR.
([#435](#435))

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

### Patch Changes

- fix: add enableCSSInvalidation for encodeCSS of css HMR, this will fix
pseudo-class (such as `:active`) not working in HMR.
([#435](#435))

## create-rspeedy@0.9.0



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



## upgrade-rspeedy@0.9.0



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

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

@luhc228 luhc228 luhc228 approved these changes

@PupilTong PupilTong Awaiting requested review from PupilTong

@upupming upupming Awaiting requested review from upupming upupming is a code owner

@gaoachao gaoachao Awaiting requested review from gaoachao

Assignees

@colinaaa colinaaa

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

[Bug]: First build failed with Bun (ver. 1.2.5)

2 participants

@colinaaa @luhc228