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

@wordpress/block-editor does not work standalone #23332

Closed
saas-developer opened this issue Jun 20, 2020 · 6 comments
Closed

@wordpress/block-editor does not work standalone #23332

saas-developer opened this issue Jun 20, 2020 · 6 comments
Labels
npm Packages Related to npm packages [Package] Block editor /packages/block-editor

Comments

@saas-developer
Copy link

Describe the bug
A clear and concise description of what the bug is.
@wordpress/block-editor does not compile/run outside gutenberg.

To reproduce
Steps to reproduce the behavior:

  1. Go here: https://www.npmjs.com/package/@wordpress/block-editor
  2. Look at the usage example and copy and paste the code in a simple react app
  3. It does not compile.
  4. Error is
./node_modules/@wordpress/components/build-module/alignment-matrix-control/index.js
Attempted import error: 'unstable_Composite' is not exported from 'reakit' (imported as 'Composite').

Expected behavior
A clear and concise description of what you expected to happen.
A standalone gutenberg editor should be initialized

Screenshots
If applicable, add screenshots to help explain your problem.
Screen Shot 2020-06-19 at 11 09 41 PM

Editor version (please complete the following information):

  • WordPress version: [e.g: 5.3.2]
  • Does the website has Gutenberg plugin installed, or is it using the block editor that comes by default? [e.g: "gutenberg plugin", "default"]
  • If the Gutenberg plugin is installed, which version is it? [e.g., 7.6]

Desktop (please complete the following information):

  • OS: [e.g. iOS] MAC
  • Browser [e.g. chrome, safari] Chrome
  • Version [e.g. 22] 83

Smartphone (please complete the following information):

  • Device: [e.g. iPhone6] N/A
  • OS: [e.g. iOS8.1]
  • Browser [e.g. stock browser, safari]
  • Version [e.g. 22]

Additional context

@gziolo gziolo added [Package] Block editor /packages/block-editor npm Packages Related to npm packages labels Jun 20, 2020
@gziolo
Copy link
Member

gziolo commented Jun 21, 2020

The issue is caused by the fact that the block editor was using unstable API from Reakit that was promoted to stable API. It should get resolved in a few days when WordPress packages with related changes are published to npm.

Related comment in Reakit library where I ask whether renamed API can be aliased for backward compatibility: ariakit/ariakit#667 (comment)

@gziolo
Copy link
Member

gziolo commented Jun 21, 2020

I think #23236 resolves it on our end, @diegohaz can you confirm?

@diegohaz
Copy link
Member

#23236 fixes this, but it doesn't help with older versions. 😕

I'll make a patch on Reakit to fix this asap.

Ideally, when using experimental modules from npm packages, we should use the exact version in our package.json (without ^).

@diegohaz
Copy link
Member

It should be fixed now!

@joaojoyce
Copy link

Sorry for the dumb question, but how can I "npm install @wordpress/block-editor" for this particular fix/branch?

@gziolo
Copy link
Member

gziolo commented Jun 23, 2020

You only need to install a new version of Reakit.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
npm Packages Related to npm packages [Package] Block editor /packages/block-editor
Projects
None yet
Development

No branches or pull requests

4 participants