Bug: Unable to find an active editor state. State helpers or node methods can only be used synchronously during the callback of editor.update() or editorState.read().
Lexical version:
Lexical version: 0.16.1 Browser: Chrome latest version Device: mac
Steps To Reproduce
Link to code example:
The current behavior
The expected behavior
Impact of fix
Generally this happens when you have multiple versions of lexical in the same app, or you are calling a state helper or node method from outside editor.update or editorState.read.
Generally this happens when you have multiple versions of lexical in the same app, or you are calling a state helper or node method from outside editor.update or editorState.read.
I have the same problem with this issues: https://github.com/facebook/lexical/issues/5934
The version has been downgraded to 0.14.1 and is operational
Generally this happens when you have multiple versions of lexical in the same app, or you are calling a state helper or node method from outside editor.update or editorState.read.
I'm not sure if it has anything to do with the webpack version, I'm currently using webpack 4
It's likely that the problem is your webpack configuration. If you are not otherwise mixing versions or esm/cjs imports, the webpack configuration may be doing this in a way that's not as obvious.
It's likely that the problem is your webpack configuration. If you are not otherwise mixing versions or esm/cjs imports, the webpack configuration may be doing this in a way that's not as obvious.
First of all, there is definitely no version mixing. Can you tell me how to change the WebPack-related configuration to solve this problem
I don't know what's wrong with your configuration, it should work with the defaults at least with recent versions. Other people are successfully using current lexical with webpack.
Hi, I encounter same issue, I'm sure that we didn't mix up the lexical version and not build tool cache, any advise to chase this issue ?
In every case I've seen it's either mixed versions or some other bundler configuration issue that causes multiple copies to be included on the same page. Without a full reproduction of the issue I couldn't give you any more specific advice than that. Maybe make sure you are using a current version of the bundler tooling (webpack, vite, rollup, etc.)
Same problem
Try upgrading to webpack 5
We cannot update Webpack now because there are changes that are breaking, and our project is very large. Is it possible to fix this issue in a different way? Webpack version: 4.43.0.
You would need to manually make sure all of the lexical modules are using the correct exports, or maybe find an old webpack 4 plug-in for supporting the exports field of package.json
We tried the demo code described in the official docs here: https://lexical.dev/docs/getting-started/react How to adjust this code to have correct exports?
Our goal is to have something similar to this demo: https://playground.lexical.dev/?showTreeView=false
Sorry, I'm not an expert in webpack 4 configuration. You need to make sure every lexical module (lexical, @lexical/react, etc.) is resolved to the correct mjs file.
That's the kind of problem that should be handled at the library level, not application level. I have added lexical and I'm having the exact same issue pasting code from lexical documentation.
The library simply cannot function when multiple versions are present. If you've installed it correctly, with a consistent version, you should not get this error.
npm install --save lexical @lexical/react is what I used, I can't imagine how I would install it incorrectly. It can be made to work if you add aliases in your webpack config for every imported module but it is not how things should be.
If you got this error then you have multiple versions, I can't tell you what went wrong without being able to inspect your project, but there's really nothing we can do about it if your package.json or package-lock.json doesn't satisfy the constraints or your bundler configuration is not setup correctly with modern tools.
Sure there is.
- Have an actually useful error message. You yourself have mentioned in another issue that the message is not helpful to diagnose to issue.
- Put the
package.jsonandpackage-lock.jsonconstraints you speak of in the documentation. - Mention somewhere, anywhere that using webpack versions < 5 will cause this issue. See here.
I daresay any combination of the above would be more useful and helpful than telling people that they have multiple versions even after they tell you the command they used to install (which incidentally is copy/pasted from the documentation).
Interestingly, I ran into this error today 😄. In my case, it was caused by calling $getSelection outside the editor context. I fixed it by passing the editor instance into the function that needed it 🙌. If anyone else hits this issue, it's worth checking that you're only accessing editor-based state like selections within an editor.update() context.