[5.4] npm run watch not working

yup, I'm sure it's my webpack ingnorance

@Roni I am pretty new to webpack as well, were you able to find a solution and get watch working?

Have you tried the usual? Upgrade node. A lot of the times hot reloading doesn't work because you haven't got an updated node ( I've seen cases where people are still running Node 4 lol ). I know a lot of people have troubles with the hot reloading with create-react-app because their node is really outdated.

@winnn Yeah I'm running homestead using Node 6.9.2 and NPM 4.1.2

Not working for me as well. @laracast any help?

@saaz I'd of course need more information to help debug. OS, Node/NPM version, etc. Using a VM or not?

Try adding the --watch-poll flag to your NPM script. Or just try:

node_modules/.bin/webpack --watch --watch-poll --config=node_modules/laravel-mix/setup/webpack.config.js

Thanks @JeffreyWay! That fixed it for me (versions posted above)

Having the same issue here on a fresh Homestead (Windows 7) installation. Adding the --watch-poll makes watching work but compilation feels sluggish.

Node v6.9.1 NPM 3.10.8

Hope that helps...

Noting that I had the same issue, the snippet that @JeffreyWay provides. My question is;

1. Why is this needed (for some and not others)?
2. Should this have been mentioned here; https://github.com/laravel/laravel/blob/master/package.json#L5

I may have experienced this issue because I upgraded from 5.3.* to 5.4.*.

I'm still having this issue with a fresh 5.4 install and a package.json of

{
  "private": true,
  "scripts": {
    "dev": "node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "watch": "node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "hot": "node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
    "production": "node node_modules/cross-env/bin/cross-env.js NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
  },
  "devDependencies": {
    "axios": "^0.15.2",
    "foundation-sites": "^6.3.0",
    "laravel-mix": "^0.6.0",
    "lodash": "^4.16.2",
    "vue": "^2.0.1",
    "jquery": "^3.1.0"
  }
}

npm run watch just doesn't seem to do anything.

Cheers

Same issue here - cannot figure out to get this to work.

I'm all for progress but the documentation on mix is sparse and elixir did seem to work really well.

For instance I'm not sure how to pass an array to

mix.sass

Should I be using mix.combine for this?

I really want to preserve with mix but it's certainly slowed dev time.

Add this to your package.json file.

"babel": { "presets": [ "es2015" ] }

Run "npm run watch" on your local machine helped for me!

@Moe 's solution worked for me.

Run "npm run watch-poll" on your machine! its worked for me. Laravel 5.4 have watch-poll by default.

I was having issues as well and noticed that cross-env had a wrong path in the scripts section of package.json file. Looks like that has been fixed with this pull request.

Mgorunuch solution works for me on my homestead vm. Thx.

running it on the local machine worked for me.

I had to change my watch because of symlinks,

This required me to change my watch-poll

    "x-dev": "node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
        
    "x-watch": "node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    
    "x-watch-poll": "npm run x-watch -- --watch-poll"

I made "x-watch" because we had a guy developing on a mac and didn't need this fix.

Thanks @JeffreyWay Changed package.json to this (changed default watch command and used the opne you wrote)

{
    "private": true,
    "scripts": {
        "dev": "npm run development",
        "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
        "watch": "node_modules/.bin/webpack --watch --watch-poll --config=node_modules/laravel-mix/setup/webpack.config.js",
        "watch-poll": "npm run watch -- --watch-poll",
        "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
        "prod": "npm run production",
        "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
    },
    "devDependencies"
....
    }
}

sudo sysctl fs.inotify.max_user_watches=900000000

I fix this by adding more watcher to webpack.

See this link: https://webpack.github.io/docs/troubleshooting.html

On "webpack doesn’t recompile on change while watching" part.

I'm still stuggling with this - I have changed my package.json to resemble Hype's above, & am running npm run watch --watch-poll

Correct me if I'm wrong, but I am utilising Homestead so that I can contain all my development to that machine - I dont want to have to run npm watch locally.

I've found this too, & have now got this "fsnotify": https://github.com/JeffreyWay/laravel-mix/blob/master/docs/faq.md#im-using-a-vm-and-webpack-isnt-picking-up-my-file-changes

Now it's telling me that there's "Nothing to sync"

I'm noob at all this - so feel free to go basic with any thoughts you may have!!

OK .. so I burnt plenty of time on this, to find out I need just run Jeffreys' convoluted command at the head of this post .. modules/.bin/webpack --watch --watch-poll --config=node_modules/laravel-mix/setup/webpack.config.js

I've made an alias in my .bashrc for it.

.. so dont mind me - move along!

You can alternatively add --watch-poll to the "watch" script in package.json. That solved the problem for me. Like so:

"watch": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --watch-poll --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",

In my case, webpack is just not indicating of changes. But, does recompile assets in the background.

I was looking for some visual indication that recompiling was taking place, but in my case (like @mcraz says) it was happening in the background without issue.

If you use Homestead VM, run "npm run watch-poll" It's ok for me Thks @Mgorunuch

@thibaultvanc life saver, thank you

@mariordev Very good. İt is best answer rep. Very thanks.