Laravel-mix: js + sass + copy = watch/compile loop

[nicgutierrez]

Hi

It seems that using mix.js() + mix.sass() + mix.copy() causes npm run watch to keep compiling.

Here's the code I'm using:

    .js('./resources/assets/js/nebula.js', './js')
    .sass('./resources/assets/sass/nebula.scss', './css')
    .copy('./js/nebula.js', '../../../public/vendor/nebula.js')
    .copy('./css/nebula.css', '../../../public/vendor/nebula.css')

I'm running mix inside a packages/vendor/name folder, so not in the project's route.

When I run npm run watch my console gets crazy and the only things I can see are

WAIT: compiling...
WAIT: Compiled successfully in Nms
WAIT: compiling...
WAIT: Compiled successfully in Nms
WAIT: compiling...
WAIT: Compiled successfully in Nms
WAIT: compiling...
WAIT: Compiled successfully in Nms

and so on.

[JeffreyWay]

I'm not sure. Can you break it down and give me simple reproducible steps?

[nickkuijpers]

I had the same with the .sass, trying to debug now.

[nickkuijpers]

This might solve your issue @nicgutierrez https://github.com/JeffreyWay/laravel-mix/issues/228

[nicgutierrez]

thanks @nickkuijpers , I'll look into it :)

[glennjacobs]

I too am having this problem when developing a package and wanting to automatically copy the compiled assets to the app's public/vendor folder.

I have tried the response to issue #228 but it didn't help. @nicgutierrez did you manage to fix it?

[ruchern-chong]

It's some package that you removed but left in the webpack.mix.js that causes this (not all the time). I had this issue before.

[glennjacobs]

@ruchern I don't think it's that in my case.

This is my webpack.mix.js

const { mix } = require('laravel-mix');

mix.setPublicPath(__dirname + "/public");
mix.setResourceRoot(__dirname + "/resources");

mix.js('resources/assets/js/app.js', 'js')
    .sass('resources/assets/sass/app.scss', 'css')
    .copy('resources/assets/images', 'public/images', false);

if (mix.config.inProduction) {
    mix.version();
}

mix.copy('public', '../../../public/vendor/my_package', false);

[ruchern-chong]

Try placing that last line of copy before any compiling?

And for directories, use the mix.copyDirectory() helper.

[glennjacobs]

I would need to compile them before copying though...

[glennjacobs]

When I remove the copy line, it doesn't infinite loop, weird.

[ruchern-chong]

Try mix.copyDirectory() for last line. That looks like a directory to me. Assuming only.

[glennjacobs]

copyDirectory doesn't work at all, I think it's documented incorrectly. That's why I included the false parameter.

[codewithfeeling]

I am also seeing this issue on a brand new install of Laravel 5.4 but without even running the copy command. My mix file is really simple:

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

I have commented out both parts in turn and it's the processCssUrls part of the sass script that causes the loop. If I comment out the background definition here:

body {
  background: url('images/bg-widescreen.jpg') no-repeat;

Then it compiles with no issues. Also if I change the mix file to:

mix.js('resources/assets/js/main.js', 'public/js')
   .sass('resources/assets/sass/app.scss', 'public/css')
   .options({ processCssUrls: false });

It compiles with no issues.

[DraganLibraFire]

@raffjones this worked for me
.options({ processCssUrls: false });
thanks!