Adminlte: ERROR in ./node_modules/admin-lte/dist/img/boxed-bg.jpg

Created on 2 Mar 2018  路  5Comments  路  Source: ColorlibHQ/AdminLTE

I run npm run prod which is:

cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js

Using npm 5.6.0

app.scss

@import "~admin-lte/dist/css/AdminLTE.css";
@import "~admin-lte/dist/css/skins/_all-skins.css";
error  in ./node_modules/admin-lte/dist/img/boxed-bg.jpg
remote:
remote: Module build failed: Error: write EPIPE
remote:     at _errnoException (util.js:1022:11)
remote:     at WriteWrap.afterWrite [as oncomplete] (net.js:867:14)
remote:
remote:  @ ./node_modules/css-loader??ref--8-2!./node_modules/postcss-loader/lib??postcss!./node_modules/admin-lte/dist/css/AdminLTE.css 7:782-812
remote:  @ ./node_modules/css-loader??ref--8-2!./node_modules/postcss-loader/lib??postcss!./node_modules/resolve-url-loader??ref--8-4!./node_modules/sass-loader/lib/loader.js??ref--8-5!./resources/assets/sass/app.scss
remote:  @ ./resources/assets/sass/app.scss



ERROR in ./node_modules/admin-lte/dist/img/boxed-bg.jpg
remote: Module build failed: Error: write EPIPE
remote:     at _errnoException (util.js:1022:11)
remote:     at WriteWrap.afterWrite [as oncomplete] (net.js:867:14)
remote:  @ ./node_modules/css-loader??ref--8-2!./node_modules/postcss-loader/lib??postcss!./node_modules/admin-lte/dist/css/AdminLTE.css 7:782-812
remote:  @ ./node_modules/css-loader??ref--8-2!./node_modules/postcss-loader/lib??postcss!./node_modules/resolve-url-loader??ref--8-4!./node_modules/sass-loader/lib/loader.js??ref--8-5!./resources/assets/sass/app.scss
remote:  @ ./resources/assets/sass/app.scss
remote:  @ multi ./resources/assets/js/app.js ./resources/assets/sass/app.scss

How can I fix this boxed-bg.jpg problem? I can't push on production due to this.

It seems this part is the issue:

.layout-boxed {
  background: url('../img/boxed-bg.jpg') repeat fixed;
}

Most helpful comment

You can solve this by setting processCssUrls to false:

mix.sass('/path/to/', '/path/to/')
   .options({
      processCssUrls: false
   });

All 5 comments

Try to run npm with --no-bin-links option, it helped to me.

npm install --no-bin-links
npm rebuild --no-bin-links
npm run watch # or npm run prod

Thanks for the reply @ed-fruty

I ended up coping the AdminLTE.css from node_modules and paste it to my public/css folder. Then I removed the .layout-boxed class that was creating this issue and it build with no problems after. I know it's not the best solution the down side of this is when AdminLTE updates I need to manually again copy paste the css. If there is a better option I am glad to hear it.

You can solve this by setting processCssUrls to false:

mix.sass('/path/to/', '/path/to/')
   .options({
      processCssUrls: false
   });

Hello,

The problem exists also with less files.

In build/less/variables.less please replace

@boxed-layout-bg-image-path: "../img/boxed-bg.jpg";

by

@boxed-layout-bg-image-path: "../../dist/img/boxed-bg.jpg";

This issue is already fix

Was this page helpful?
0 / 5 - 0 ratings

Related issues

kgoedert picture kgoedert  路  4Comments

gaea44 picture gaea44  路  3Comments

jrandhawa09 picture jrandhawa09  路  3Comments

akbajwaakgec picture akbajwaakgec  路  3Comments

vbetancourt picture vbetancourt  路  3Comments