Laravel-mix: Laravel Mix Browser Sync stopped working on Linux Mint

[simonhunt]

This problem is occurring on a fresh install. However, I have run the suggested commands (reinstall node/check for elixir etc.) anyway.

• Laravel Mix Version: 1.4.5
• Node Version: 8.6.0
• NPM Version: 5.4.2

• OS: Linux Mint 18 Cinnamon 64-bit

• [email protected]

• [email protected]

Description:

When running 'npm run watch' the following error is returned:

events.js:182
throw er; // Unhandled 'error' event
^

Error: watch app ENOSPC
at _errnoException (util.js:1019:11)
at FSWatcher.start (fs.js:1383:19)
at Object.fs.watch (fs.js:1409:11)
at createFsWatchInstance (/home/simon/Code/exp/testWatch/node_modules/chokidar/lib/nodefs-handler.js:37:15)
at setFsWatchListener (/home/simon/Code/exp/testWatch/node_modules/chokidar/lib/nodefs-handler.js:80:15)
at FSWatcher.NodeFsHandler._watchWithNodeFs (/home/simon/Code/exp/testWatch/node_modules/chokidar/lib/nodefs-handler.js:228:14)
at FSWatcher.NodeFsHandler._handleDir (/home/simon/Code/exp/testWatch/node_modules/chokidar/lib/nodefs-handler.js:407:19)
at FSWatcher. (/home/simon/Code/exp/testWatch/node_modules/chokidar/lib/nodefs-handler.js:455:19)
at FSWatcher. (/home/simon/Code/exp/testWatch/node_modules/chokidar/lib/nodefs-handler.js:460:16)
at FSReqWrap.oncomplete (fs.js:154:5)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @ watch: cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the @ watch script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! /home/simon/.npm/_logs/2017-09-30T22_19_30_813Z-debug.log

Steps To Reproduce:

Install a new Laravel app using 'laravel new '
Run 'npm install'

Add:

mix.js('resources/assets/js/app.js', 'public/js')
   .sass('resources/assets/sass/app.scss', 'public/css')
   .browserSync('thephysics.dev');

to webpack.mix.js.

Run 'npm run watch' (install extra dependencies the first time)
Run 'npm run watch' again - see the error described above.

---

This was working fine last week.
It didn't work on a new project tonight.
Having upgraded npm and node it now doesn't work on any projects (even after reinstalling all node dependencies).

Help!

[ruchern-chong]

ENOSPC = No space left on drive.

[simonhunt]

That's not it, as I have 4.6 Gb of free space on the drive concerned.

That may be what the error means - but it doesn't make any sense.

[ruchern-chong]

What is the capacity of your swapfile?

[simonhunt]

Thanks @ruchern

/tmp is 66.7 kb - is that what you meant?

I've tried using:

npm config set tmp /path/to/some/other/dir

And no joy with that either.

What I have noticed, is that it only seems to happen when I have VS Code open before running npm run watch. And the thing that changed at the weekend is that I was trying VS Code out for the first time on this machine.

Two possible solutions:
1) VS Code is hogging more memory than either atom or PHP Storm (I don't know enough about VS Code to know if this is the case).
2) VS Code is doing something odd.

It tends to suggest that it isn't anything to do with Mix though (as I've recreated the same problem when using BrowserSync directly also).

[simonhunt]

The solution to this seems to be to increase the number of 'watches' the linux system can handle by running this command:

echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p

This comes from the following Stack Overflow thread:

https://stackoverflow.com/questions/16748737/grunt-watch-error-waiting-fatal-error-watch-enospc

It doesn't explain why the problem is only with VS Code (other than assuming that VS code uses a lot of 'watches').

[ruchern-chong]

@simonhunt Sorry that I have missed your reply. No, not that. I am referring to this file /swapfile.

I had that issue just the other day after I have migrated my production server. Adding a 4G swapfile fixed the issue for me.

I am not sure if this applies to Linux Mint: https://www.digitalocean.com/community/tutorials/how-to-add-swap-space-on-ubuntu-16-04

[simonhunt]

Thanks again @Ruchern - really grateful for your time.

I've actually reinstalled Linux Mint in an attempt to solve this thread since and set the swapfile to nearly 15 Gb (twice my RAM). This didn't work, but I have literally just posted something which did fix it.

It appears to be something to do with the default number of files which can be watched. By increasing that number the process works now.

[ruchern-chong]

Cool that at least you found a fix to it.

[juddfranklin1]

@simonhunt your solution fixed the same problem for me when I am running this mix directly in Konsole on Ubuntu 18.x. The problem cropped up for me when I added a sass process to my mixfile.

Thanks!

[abdulrahman19]

@simonhunt your solution fix the problem .. thanks.

[dotnetCarpenter]

This is not laravel-mix related but due to "files.useExperimentalFileWatcher": true, which is the default in vscode, does not work on linux.
Here is the main issue: https://github.com/Microsoft/vscode/issues/45295
And here, I've written a resume and workaround: https://github.com/Microsoft/vscode/issues/62314#issuecomment-434990537

TL;DR set "files.useExperimentalFileWatcher": false in vscode.

[dotnetCarpenter]

Actually, https://github.com/Microsoft/vscode/issues/40898 is the main issue.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.