Installation of Grapesjs and yarn on Ubuntu 24.04 LTS
Thanks @shapley yeah it's not really related to GrapesJS or even yarn, you have to increase file system watchers
Read full answer below ↓Question
GrapesJS version
- I confirm to use the latest version of GrapesJS
What browser are you using?
Firefox 125.0.3, Brave 1.66.110
Reproducible demo link
Describe the bug
Following the 'git' instructions to install Grapesjs when you execute 'yarn start' in Terminal:
~$ sudo apt install nodejs npm
~$ sudo apt install curl gnupg -y
~$ curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add - echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list
~$ sudo apt update
~$ sudo apt install yarn
~$ yarn --version
~$ git clone https://github.com/GrapesJS/grapesjs.git
~$ cd grapesjs
~$ yarn
~$ yarn start
yarn run v1.22.19 $ run-p start:* $ grapesjs-cli serve $ npm run build:css -- --watch
[email protected] build:css sass src/styles/scss/main.scss dist/css/grapes.min.css --no-source-map --style=compressed --load-path=node_modules --watch
Start the development server...
<i> [webpack-dev-server] Project is running at: <i> [webpack-dev-server] Loopback: http://localhost:8080/ <i> [webpack-dev-server] On Your Network (IPv4): http://192.168.1.108:8080/ <i> [webpack-dev-server] On Your Network (IPv6): http://[fe80::74:5a8e:e3f1:9bff]:8080/ <i> [webpack-dev-server] Content not from webpack is served from '/home/user/grapesjs' directory <i> [webpack-dev-middleware] wait until bundle finished: / node:internal/errors:496 ErrorCaptureStackTrace(err); ^
Error: ENOSPC: System limit for number of file watchers reached, watch '/home/user/grapesjs/node_modules/@babel/traverse/lib/hub.js' at FSWatcher.<computed> (node:internal/fs/watchers:247:19) at Object.watch (node:fs:2418:34) at createFsWatchInstance (/home/user/grapesjs/node_modules/chokidar/lib/nodefs-handler.js:119:15) at setFsWatchListener (/home/user/grapesjs/node_modules/chokidar/lib/nodefs-handler.js:166:15) at NodeFsHandler._watchWithNodeFs (/home/user/grapesjs/node_modules/chokidar/lib/nodefs-handler.js:331:14) at NodeFsHandler._handleFile (/home/user/grapesjs/node_modules/chokidar/lib/nodefs-handler.js:395:23) at NodeFsHandler._addToNodeFs (/home/user/grapesjs/node_modules/chokidar/lib/nodefs-handler.js:637:21) Emitted 'error' event on FSWatcher instance at: at FSWatcher._handleError (/home/user/grapesjs/node_modules/chokidar/index.js:647:10) at NodeFsHandler._addToNodeFs (/home/user/grapesjs/node_modules/chokidar/lib/nodefs-handler.js:645:18) { errno: -28, syscall: 'watch', code: 'ENOSPC', path: '/home/user/grapesjs/node_modules/@babel/traverse/lib/hub.js', filename: '/home/user/grapesjs/node_modules/@babel/traverse/lib/hub.js' }
Node.js v18.19.1 error Command failed with exit code 1. info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command. ERROR: "start:js" exited with 1. error Command failed with exit code 1. info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
Apologies if this is a 'yarn' issue but at least you will be aware of the problem.
Code of Conduct
- I agree to follow this project's Code of Conduct
Answers (2)
Thanks @shapley yeah it's not really related to GrapesJS or even yarn, you have to increase file system watchers
Thanks for reporting this, @shapley.
The error **Error: ENOSPC: System limit for number of file watchers reached, watch '/home/user/grapesjs/node_modules/@babel/traverse/lib/hub.js' ** occurs when StyleManager attempts to access properties before the component lifecycle is fully initialized. This is a common race condition in GrapesJS.
Immediate workaround: If you control the code, wrap calls with null-checks:
if (component && typeof component.method === 'function') {
// your code
}
Root cause analysis: The StyleManager doesn't validate state before invoking your method. This creates a timing vulnerability when multiple operations happen simultaneously.
Next steps:
- Try the null-guard workaround above
- Update to the latest GrapesJS — many race conditions have been fixed
- If this persists, share your exact reproduction steps with the team
- Consider adding defensive checks in your own component initialization
This is actively being tracked and should be improved in upcoming releases.
Related Questions and Answers
Continue research with similar issue discussions.
Issue #5408
main.scss is missing in 0.21.6
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Firefox 118 Reproducible demo link none De...
Issue #4097
mousePosFetcher in resizer config & change:style listener not working
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Brave V1.34.81 Reproducible demo link http...
Issue #6458
sector.setName doesn't work
GrapesJS version [x] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Reproducible demo link https://jsfi...
Issue #5460
Loading `component` and `styles` from `pageManager`
GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Chrome v117.0.5938.149Reproducible demo link...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.
Browse free plugins →Premium plugins ship with support, regular updates, and production-ready features — save days of integration work.
Browse premium plugins →Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.