[Vuejs]-Vue CLI Project doesnt Hot Reload after yarn -> npm switch. No config files either?

0👍

What was the cause in my case(I have Linux OS):

It seems that the value of: max_user_watches
in the /proc/sys/fs/inotify/max_user_watches
is affecting webpack => which is interfering with hot reloading.

To check your actual value

$cat /proc/sys/fs/inotify/max_user_watches
16384

16384 was in my case and it still wasn’t enough.
So you will need to increase your value as well.

SOLUTION if you have Linux OS:

Create the file:

sudo nano /etc/sysctl.d/90-override.conf

And populate it with:

fs.inotify.max_user_watches=200000

It seems 200000 is enough for me, you can have a higher value if you want.

After you create the file and add the value, just restart the PC and you should be ok.

-1👍

Vue CLI depends on @vue/cli-service which acts exactly like Facebook’s Create React App (react-scripts).

If you are familiar with create-react-app, @vue/cli-service is roughly
the equivalent of react-scripts, although the feature set is
different.

https://cli.vuejs.org/guide/#cli-service

So what both of them do is “simplify” configuration of the project for you by hiding all the bundling configs (e.g. webpack.config.js) under the carpet. Which is handy in most cases, unless you decide to do something fancy (like switch package manager). In Create React App one can bail out from this behavior by running yarn eject or npm run eject, but on Vue CLI platform you are locked in. So there’s no straightforward way to make all underlying config files to appear and fix the faulty bits in them.

To be contunued?..

Leave a comment