Laravel-mix: `mix.extract()` causing the resources processing to freeze with `95% emitting` message

[arcanedev-maroc]

• Laravel Mix Version: 1.0.3 (npm list --depth=0)
• Node Version (node -v): 6.10.3
• NPM Version (npm -v): 5.0.3
• OS: Windows 8.1

npm list --depth=0

+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
`-- [email protected]

npm ERR! peer dep missing: webpack@^2.2.0, required by [email protected]
npm ERR! peer dep missing: webpack@^2.2.0, required by [email protected]

Description:

Hi artisans,

Can anybody confirm this (Especially on Windows) or am i the only one who have this issue !!

Steps To Reproduce:

Start with a new laravel installation

Edit the webpack.mix.js file like this

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

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

mix.autoload({
    jquery: ['$', 'window.jQuery', 'jQuery']
});

mix.js('resources/assets/js/app.js', 'public/js');

mix.extract([
    'axios', 'vue', 'jquery', 'bootstrap-sass',
], '/assets/js/vendors.js');

After that run: npm run dev

λ npm run dev

> @ dev d:\...\test-mix
> npm run development

npm WARN invalid config loglevel="notice"

> @ development d:\...\test-mix
> cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js

 95% emitting

And if you comment the mix.extract([...], '/assets/js/vendors.js');, the build pass !!

Also, i want to point something weird with mix-manifest.json:

{
    "/d:/assets/js/vendors.js": "/d:/assets/js/vendors.js",
    "/js/app.js": "/js/app.js",
    "/css/app.css": "/css/app.css",
    "/css/admin.css": "/css/admin.css",
    "/js/manifest.js": "/js/manifest.js"
}

I think the first line "/d:/assets/js/vendors.js": "/d:/assets/js/vendors.js", is invalid because it starts with /d:/assets !!

[merlindiavova]

I was getting the same thing. I removed my package-lock.json file and ran npm install again. It was fine. Try that otherwise repeat the same as above except in your package.json change laravel-mix version 0.*

[imuller]

Same issue here. Keeps freezing on Windows 10 with latest Laravel-mix version..

[arcanedev-maroc]

UPDATE: I've upgraded the laravel-mix to 1.0.7 and still have the same issue.

And it doesn't matter if you install the packages with npm or yarn.

[PascaleBeier]

Got the same issue but with mix.js() as well as with mix.extract() on win10. Not on my Linux though.

[PascaleBeier]

@arcanedev-maroc

mix.setPublicPath('./'); solves this for me - can you confirm?

[arcanedev-maroc]

Hi @PascaleBeier,

Thanks for your suggestion but it doesn't work for me.

[taai]

I use Laravel Mix also for non-Laravel projects where is no artisan file which, apparently, is being used by Laravel Mix to detect Laravel (in which case publicPath is being set to public automatically). I was struggling with this issue after upgrading from version 0.8.8 to version 1.0.7 until I found out what was the cause of that 95% emitting message.

So, yes, @PascaleBeier is [almost] right, you should set publicPath like this:

mix
.options({
    publicPath: 'public'
})

[arcanedev-maroc]

Unfortunately, it doesn't solve my issue.

I'm using fresh laravel installation (v5.4) to test the new laravel-mix (v1.*).

@taai, i tried your solution but with no success :

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

mix.options({
    processCssUrls: false,
    publicPath: 'public'
});

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

mix.autoload({
    jquery: ['$', 'window.jQuery', 'jQuery']
});

mix.js('resources/assets/js/app.js', 'public/js');

mix.extract([
    'axios', 'vue', 'jquery', 'bootstrap-sass',
], '/assets/js/vendors.js');

[taai]

@arcanedev-maroc Easy! The cause of the problem is the same – wrong paths! In this case, you are starting the path with a slash ( / ), but you shouldn't, because this tool thinks that you want to define absolute path (/assets/js/vendor.js) and, I'm pretty sure, the Git bash is freaking out, because in case of disk D: the absolute path should be /d/assets/js/vendor.js... 😉

If you wanted to extract vendors.js file to public/assets/js/vendors.js, then this should do it:

mix.extract([
    'axios', 'vue', 'jquery', 'bootstrap-sass',
], 'public/assets/js/vendors.js');

@JeffreyWay , maybe you could make Laravel Mix to check if the disk drive exists? Because nobody can guess that 95% emitting means that the disk doesn't exist. But this is definately __not a bug__.

[arcanedev-maroc]

OMG @taai, you're a lifesaver 🙌

I've changed the code to this and it WORKS!!!

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

mix.options({
    processCssUrls: false,
    publicPath: 'public'
});

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

mix.autoload({
    jquery: ['$', 'window.jQuery', 'jQuery']
});

mix.js('resources/assets/js/app.js', 'public/assets/js');

mix.extract([
    'axios', 'vue', 'jquery', 'bootstrap-sass',
], 'public/assets/js/vendors.js');

@JeffreyWay, i don't know if it's a bug or an attendant behavior. But it's definitely a breaking change (Or only for Windows users ?) when you upgrade from laravel-mix 0.x to 1.x.

[ruchern-chong]

@arcanedev-maroc

Based on the documentation, the filenames are automatically done for you. Not sure if specifying a filename, which in this case, the same filename does affect it or not.

[cmosguy]

Can someone please test this again? It is failing on my windows 10 system as well.

[mibrito707]

@taai thank you for that, I was also using W10 and laravel-mix for a non Laravel project and
mix .options({ publicPath: 'public' })
works for me perfectly.

[Hujjat]

Putting

mix.options({
    publicPath: 'public'
})

in webpack.mix.js worked just fine

thanks.

[SeyamMs]

i'm not sure but this might be because you've changed the artisan file name.
this what happened to me.

[h4midr]

I had the same issue and fixed by removing "/" from the beginning of the second arg
mix.js('resources/assets/static/js/app.c7b1338e8d5b4eb4714b.js', '/static/js/app.c7b1338e8d5b4eb4714b.js')
to
mix.js('resources/assets/static/js/app.c7b1338e8d5b4eb4714b.js', 'static/js/app.c7b1338e8d5b4eb4714b.js')