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.

Laravel Mix doesn't output css files

See original GitHub issue

Description:

Hi, I’ve cloned the code at master branch on rappasof/laravel-5-boilerplate and was able to run npm install followed by npm run dev. It does process the scss files, as it generates the font files, but the css files are not been generated.

I’m running on:

Laravel Mix Version: 0.12.1
Node Version: 8.1.0
NPM Version: 5.0.3
OS: Windows 10 x64

This is the output from npm run dev:

PS D:\DevProjects\laravel-5-boilerplate.lar> npm run dev

> @ dev D:\DevProjects\laravel-5-boilerplate.lar
> npm run development


> @ development D:\DevProjects\laravel-5-boilerplate.lar
> 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

 DONE  Compiled successfully in 3399ms                                                                                                                              02:02:31


                                                                                                    Asset       Size  Chunks                    Chunk Names
                       fonts/vendor/font-awesome/fontawesome-webfont.ttf?b06871f281fee6b241d60582ae9369b9     166 kB          [emitted]
  fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.eot?f4769f9bdb7466be65088239c12046d1    20.1 kB          [emitted]
  fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.ttf?e18bbf611f2a2e43afc071aa2f4e1512    45.4 kB          [emitted]
 fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.woff?fa2772327f55d8198301fdb8bcfc8158    23.4 kB          [emitted]
fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.woff2?448c34a56d699c29117adc64c43affeb      18 kB          [emitted]
                       fonts/vendor/font-awesome/fontawesome-webfont.eot?674f50d287a8c48dc19ba404d20fe713     166 kB          [emitted]
                       fonts/vendor/font-awesome/fontawesome-webfont.svg?912ec66d7572ff821749319396470bde     444 kB          [emitted]  [big]
  fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.svg?89889688147bd7575d6327160d64e760     109 kB          [emitted]
                     fonts/vendor/font-awesome/fontawesome-webfont.woff2?af7ae505a9eed503f8b8e6982036873e    77.2 kB          [emitted]
                      fonts/vendor/font-awesome/fontawesome-webfont.woff?fee66e712a8a08eef5805a46892932ad      98 kB          [emitted]
                                                                                          /js/frontend.js    1.21 MB       0  [emitted]  [big]  /js/frontend
                                                                                           /js/backend.js     980 kB       1  [emitted]  [big]  /js/backend
                                                                                                   mix.js     619 kB       2  [emitted]  [big]  mix
                                                                                        mix-manifest.json  256 bytes          [emitted]

No css files emitted!

I’m using laravel on top of apache, so I’m getting an error on the assets urls because they are absolute from root, as http://localhost:8000/fonts/vendor/font-awesome/fontawesome-webfont.woff2?af7ae505a9eed503f8b8e6982036873e and what I need is http://localhost:8000/my-project/fonts/vendor/font-awesome/fontawesome-webfont.woff2?af7ae505a9eed503f8b8e6982036873e.

After some digging, I’ve found that if I add mix.setResourceRoot('/my-project/'); in the webpack.mix.js file, I could generate the links to assets correctly, but I can’t get Laravel Mix to output the corrected css files.

How do I fix this?

Steps To Reproduce:

git clone https://github.com/rappasoft/laravel-5-boilerplate.git
npm install
npm run dev

Issue Analytics

State:
Created 6 years ago
Reactions:1
Comments:19 (8 by maintainers)

Top GitHub Comments

2reactions

JeffreyWaycommented, Jun 19, 2017

This is all fixed in the 1.0 Mix release.

2reactions

ruchernchongcommented, Jun 19, 2017

Move js() above sass()

Top Results From Across the Web

Laravel Mix doesn't output css files - Laracasts

Hi, I've cloned the code at master branch on rappasof/laravel-5-boilerplate and was able to run npm install followed by npm run dev ....

Laravel Mix doesn't output css files - Stack Overflow

After some digging, I've found that if I add mix.setResourceRoot('/my-project/'); in the webpack.mix.js file, I could generate the links to ...

CSS Preprocessors | Laravel Mix Documentation

For each call, webpack will output a new file with the relevant contents. mix.sass('src/app.scss', 'dist/') // creates 'dist/app.css' .sass('src/forum.scss' ...

Compiling Assets (Mix) - The PHP Framework For Web Artisans

Mix tasks can be chained together to define exactly how your assets should ... Sass files into their own respective CSS files and...

Laravel Mix - CSS and Java Compilation Made Easy

As we mentioned, the default directory for JavaScript and SCSS files is src/ and default output directory is dist/ . But we can...