Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

npm run hot merges stylesheets

See original GitHub issue

Laravel Mix Version: v5.0.0
Node Version (node -v): 13.1.0
NPM Version (npm -v): 6.12.1
OS: macOS Mojave 10.14.6

Description:

When compiling multiple stylesheets with mix, npm run hot seems to merge them and server them all, regardless of whether or not that sheet is included on the page.

Steps To Reproduce:

// webpack.mix.js
mix.sass('resources/sass/page_one.scss', 'public/css/page_one.css')
    .sass('resources/sass/page_two.scss', 'public/css/page_two.css') 
    .sass('resources/sass/page_three.scss', 'public/css/page_three.css') ;

// then in your head tags

<link rel="stylesheet" href="{{ mix('css/page_three.css') }}">

npm run dev/watch/prod all work normally, but npm run hot will load all three stylesheets.

Issue Analytics

State:
Created 4 years ago
Reactions:5
Comments:6 (2 by maintainers)

Top GitHub Comments

2reactions

owaleryscommented, Jul 8, 2020

This is still an issue.

0reactions

stale[bot]commented, May 2, 2020

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.

Top Results From Across the Web

Refreshing styles with "npm run hot" and sass #233 - GitHub

Greetings! I have an issue with refreshing styles in hot-mode, I don't see any errors, build was successfully compiled, I saw some movements ......

npm run dev is showing error on existing Laravel Project ...

Then I run npm install to install all dependencies and update all the dependencies. (Since I already had some updated dependencies).

The best webpack configurations for React applications

If you've struggled to configure webpack for your React app, look no further. We cover both generic and specific config needs.

Tree Shaking - webpack

Tree shaking is a term commonly used in the JavaScript context for dead-code elimination. It relies on the static structure of ES2015 module...

Moved a Laravel 8 app to another domain and now 'npm run ...

When I run npm run prod I get this error (server path and domain name removed): ... .minify(['public/css/merged.css', 'public/js/merged-header.js', ...