web-infra-dev / rspack

The fast Rust-based web bundler with webpack-compatible API 🦀️
https://rspack.dev
MIT License
9.59k stars 553 forks source link

Error with "uiwjs/react-codemirror" "Field is not present in this state" #4465

Closed hverlin closed 12 months ago

hverlin commented 12 months ago

System Info

  System: Linux (ubuntu)
  Binaries:
    Node: 18.16.0 - ~/.asdf/installs/nodejs/18.16.0/bin/node
    npm: 9.5.1 - ~/.asdf/plugins/nodejs/shims/npm
    pnpm: 8.9.0 - ~/.asdf/installs/nodejs/18.16.0/bin/pnpm
  Browsers:
    Chrome: 117.0.5938.92
  npmPackages:
    @rspack/cli: latest => 0.3.8 

Also tried with 0.3.8-canary-1c9f8af-20231026052844

Details

Getting the following error with https://uiwjs.github.io/react-codemirror/ When you click into the input, you get the following with the production build:

Compiled with problems:
ERROR
Field is not present in this state
RangeError: Field is not present in this state
    at eb.field (http://localhost:8080/main.js:1:404152)
    at d (http://localhost:8080/main.js:1:318114)
    at ex (http://localhost:8080/main.js:1:338603)
    at U.update [as updateF] (http://localhost:8080/main.js:1:337941)
    at Object.update (http://localhost:8080/main.js:1:396056)
    at eb.computeSlot (http://localhost:8080/main.js:1:404778)
    at X (http://localhost:8080/main.js:1:399389)
    at new eb (http://localhost:8080/main.js:1:404054)
    at eb.applyTransaction (http://localhost:8080/main.js:1:404734)
    at get state [as state] (http://localhost:8080/main.js:1:400853)

I cannot reproduce this issue with webpack.

Reproduce link

No response

Reproduce Steps

Create an app using rspack

pnpm create rspack@latest
pnpm add @uiw/react-codemirror

Update main.jsx with

import React from 'react'
import ReactDOM from 'react-dom/client'
import CodeMirror from '@uiw/react-codemirror';

ReactDOM.createRoot(document.getElementById('root')).render(
  <React.StrictMode>
   <CodeMirror />
  </React.StrictMode>
)

Updated the rspack.config.js to use production mode.

module.exports = {
    mode: 'production',
    context: __dirname,
    entry: {main: "./src/main.jsx"},
    devServer: {hot: false},
    builtins: {html: [{template: "./index.html"}]},
    module: {rules: [{test: /\.svg$/,type: "asset"}]}
};

Run the dev-server

pnpm run dev 

Getting the following error

Field is not present in this state
RangeError: Field is not present in this state
    at eb.field (http://localhost:8080/main.js:1:404152)
    at d (http://localhost:8080/main.js:1:318114)
...
hverlin commented 11 months ago

Thanks!