Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug]: amd module require compile result different from webpack 5 #8996

Open
zlppassion opened this issue Jan 13, 2025 · 0 comments
Open

[Bug]: amd module require compile result different from webpack 5 #8996

zlppassion opened this issue Jan 13, 2025 · 0 comments
Assignees
Labels
bug Something isn't working

Comments

@zlppassion
Copy link

zlppassion commented Jan 13, 2025

System Info

After migrating from Webpack to Rspack, Monaco Editor fails to load properly. Specifically, the 'monaco-editor' module cannot be found.

Steps to Reproduce:

  • Migrate from Webpack to Rspack

  • Run the project, get error: 'monaco-editor' module not found

Details

runtime-amis-v2.6-umd 2.zip

source code: amis-ui/lib/components/Editor

loadMonaco() {
    import('monaco-editor').then(monaco => this.initMonaco(monaco));
  }

Code Comparison:
Webpack Output (Working):

Promise.resolve().then(function() {
    return new Promise(function(fullfill) {
        Promise.all(/* AMD require */[__webpack_require__.e(9866), __webpack_require__.e(915), __webpack_require__.e(1164)])
            .then(function() { 
                var __WEBPACK_AMD_REQUIRE_ARRAY__ = [__webpack_require__(20915)];
                (function(mod) {
                    fullfill(tslib.__importStar(mod))
                }).apply(null, __WEBPACK_AMD_REQUIRE_ARRAY__);
            })['catch'](__webpack_require__.oe)
    })
});

Rspack Output (Not Working):

Promise.resolve().then(function() {
    return new Promise(function(fullfill) {
        __webpack_require__(54796)(['monaco-editor'], function(mod) {
            fullfill(tslib.__importStar(mod))
        })
    })
});

Expected Behavior:
Rspack should generate similar async chunks for AMD modules as Webpack does, specifically:

  1. Should split Monaco Editor into async chunks
  2. Should properly handle AMD dynamic requires with Promise.all and webpack_require.e
  3. The compilation output should maintain webpack-like chunk loading behavior

Reproduce link

No response

Reproduce Steps

pnpm i
pnpm run build

Image Image
@zlppassion zlppassion added bug Something isn't working pending triage The issue/PR is currently untouched. labels Jan 13, 2025
@zlppassion zlppassion changed the title [Bug]: AMD Module Loading Failure: Monaco Editor Not Working in Rspack [Bug]: AMD Module Require Loading Failure Jan 13, 2025
@zlppassion zlppassion changed the title [Bug]: AMD Module Require Loading Failure [Bug]: amd module require compile result different from webpack 5 Jan 13, 2025
@GiveMe-A-Name GiveMe-A-Name self-assigned this Jan 22, 2025
@GiveMe-A-Name GiveMe-A-Name removed the pending triage The issue/PR is currently untouched. label Jan 22, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants