Laravel: Npm Run Dev schlägt für benutzerdefinierte CSS-Datei

Question

So habe ich this CSS-Datei. Auf import style tun und npm run dev innerhalb vagrant Box läuft ich folgende Fehlermeldung erhalten:

Fehler fehlgeschlagen mit 16 Fehlern 02.54.39

These relative modules were not found: 

* ../images/img-sp.png in ./~/css-loader!./~/postcss-loader!./~/resolve-url-loader!./~/sass-loader/lib/loader.js?{"precision":8,"outputStyle":"expanded","sourceMap":true}!./resources/assets/sass/app.scss 
* ../images/1.jpg in ./~/css-loader!./~/postcss-loader!./~/resolve-url-loader!./~/sass-loader/lib/loader.js?{"precision":8,"outputStyle":"expanded","sourceMap":true}!./resources/assets/sass/app.scss 
* ../images/2.jpg in ./~/css-loader!./~/postcss-loader!./~/resolve-url-loader!./~/sass-loader/lib/loader.js?{"precision":8,"outputStyle":"expanded","sourceMap":true}!./resources/assets/sass/app.scss 
* ../images/3.jpg in ./~/css-loader!./~/postcss-loader!./~/resolve-url-loader!./~/sass-loader/lib/loader.js?{"precision":8,"outputStyle":"expanded","sourceMap":true}!./resources/assets/sass/app.scss 
* ../images/cart.png in ./~/css-loader!./~/postcss-loader!./~/resolve-url-loader!./~/sass-loader/lib/loader.js?{"precision":8,"outputStyle":"expanded","sourceMap":true}!./resources/assets/sass/app.scss 
* ../images/arrow.png in ./~/css-loader!./~/postcss-loader!./~/resolve-url-loader!./~/sass-loader/lib/loader.js?{"precision":8,"outputStyle":"expanded","sourceMap":true}!./resources/assets/sass/app.scss 
* ../images/12.jpg in ./~/css-loader!./~/postcss-loader!./~/resolve-url-loader!./~/sass-loader/lib/loader.js?{"precision":8,"outputStyle":"expanded","sourceMap":true}!./resources/assets/sass/app.scss 
* ../images/16.jpg in ./~/css-loader!./~/postcss-loader!./~/resolve-url-loader!./~/sass-loader/lib/loader.js?{"precision":8,"outputStyle":"expanded","sourceMap":true}!./resources/assets/sass/app.scss 
* ../images/17.jpg in ./~/css-loader!./~/postcss-loader!./~/resolve-url-loader!./~/sass-loader/lib/loader.js?{"precision":8,"outputStyle":"expanded","sourceMap":true}!./resources/assets/sass/app.scss 
* ../images/21.jpg in ./~/css-loader!./~/postcss-loader!./~/resolve-url-loader!./~/sass-loader/lib/loader.js?{"precision":8,"outputStyle":"expanded","sourceMap":true}!./resources/assets/sass/app.scss 
* ../images/25.jpg in ./~/css-loader!./~/postcss-loader!./~/resolve-url-loader!./~/sass-loader/lib/loader.js?{"precision":8,"outputStyle":"expanded","sourceMap":true}!./resources/assets/sass/app.scss 
* ../images/26.jpg in ./~/css-loader!./~/postcss-loader!./~/resolve-url-loader!./~/sass-loader/lib/loader.js?{"precision":8,"outputStyle":"expanded","sourceMap":true}!./resources/assets/sass/app.scss 
* ../images/27.jpg in ./~/css-loader!./~/postcss-loader!./~/resolve-url-loader!./~/sass-loader/lib/loader.js?{"precision":8,"outputStyle":"expanded","sourceMap":true}!./resources/assets/sass/app.scss 
* ../images/28.jpg in ./~/css-loader!./~/postcss-loader!./~/resolve-url-loader!./~/sass-loader/lib/loader.js?{"precision":8,"outputStyle":"expanded","sourceMap":true}!./resources/assets/sass/app.scss 
* ../images/star.png in ./~/css-loader!./~/postcss-loader!./~/resolve-url-loader!./~/sass-loader/lib/loader.js?{"precision":8,"outputStyle":"expanded","sourceMap":true}!./resources/assets/sass/app.scss 
* ../images/star1.png in ./~/css-loader!./~/postcss-loader!./~/resolve-url-loader!./~/sass-loader/lib/loader.js?{"precision":8,"outputStyle":"expanded","sourceMap":true}!./resources/assets/sass/app.scss 
                    Asset  Size Chunks     Chunk Names 
      fonts/fontawesome-webfont.woff?fee66e712a8a08eef5805a46892932ad  98 kB   [emitted]   
       fonts/flexslider-icon.eot?9c9cb7a6055043933ba68854f521af45 2.08 kB   [emitted]   
    fonts/glyphicons-halflings-regular.eot?f4769f9bdb7466be65088239c12046d1 20.1 kB   [emitted]   
       fonts/flexslider-icon.svg?10e8a5455c4522c48aa975eacd4f0023 2.33 kB   [emitted]   
       fonts/flexslider-icon.ttf?b4c9e5057989b9727a5df4e0a21af33c 1.89 kB   [emitted]   
       fonts/flexslider-icon.woff?f8b92f66539473eea649c8514eb836a0 1.27 kB   [emitted]   
      fonts/fontawesome-webfont.svg?912ec66d7572ff821749319396470bde 444 kB   [emitted] [big] 
      fonts/fontawesome-webfont.ttf?b06871f281fee6b241d60582ae9369b9 166 kB   [emitted]   
      fonts/fontawesome-webfont.eot?674f50d287a8c48dc19ba404d20fe713 166 kB   [emitted]   
     fonts/fontawesome-webfont.woff2?af7ae505a9eed503f8b8e6982036873e 77.2 kB   [emitted]   
    fonts/glyphicons-halflings-regular.svg?89889688147bd7575d6327160d64e760 109 kB   [emitted]   
    fonts/glyphicons-halflings-regular.ttf?e18bbf611f2a2e43afc071aa2f4e1512 45.4 kB   [emitted]   
fonts/glyphicons-halflings-regular.woff?fa2772327f55d8198301fdb8bcfc8158 23.4 kB   [emitted]   
fonts/glyphicons-halflings-regular.woff2?448c34a56d699c29117adc64c43affeb  18 kB   [emitted]   
                   /js/app.js 1.19 MB  0 [emitted] [big] /js/app 
                 mix-manifest.json 32 bytes   [emitted]   

npm ERR! Linux 4.4.0-51-generic 
npm ERR! argv "/usr/bin/nodejs" "/usr/bin/npm" "run" "dev" 
npm ERR! node v6.10.0 
npm ERR! npm v3.10.10 
npm ERR! code ELIFECYCLE 
npm ERR! @ dev: `node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js` 
npm ERR! Exit status 2 
npm ERR! 
npm ERR! Failed at the @ dev script 'node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js'. 
npm ERR! Make sure you have the latest version of node.js and npm installed. 
npm ERR! If you do, this is most likely a problem with the package, 
npm ERR! not with npm itself. 
npm ERR! Tell the author that this fails on your system: 
npm ERR!  node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js 
npm ERR! You can get information on how to open an issue for this project with: 
npm ERR!  npm bugs 
npm ERR! Or if that isn't available, you can get their info via: 
npm ERR!  npm owner ls 
npm ERR! There is likely additional logging output above. 

npm ERR! Please include the following file with any support request: 
npm ERR!  /home/vagrant/LaraProjects/golmarket.dev/npm-debug.log 

Answer 1

Es sieht kompilieren, wie es um Ihre Bilder zu finden oder verschieben ist ausfällt. Werden sie von der CSS referenziert, als Hintergründe? Kann ein Duplikat dieser: wie

Webpack - sass loader cannot find images

Answer 2

Wie sieht Ihre webpack.mix.js Datei aussehen? Sie müssen auch sicherstellen, dass Sie die CSS korrekt in der Datei webpack.mix.js referenzieren. Vielleicht so etwas wie folgt aus:

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

mix.combine([ 
    'resources/assets/css/custom.css', 
    'resources/assets/css/sass.css' 
    ], 'public/css/all.css'); 

dann NPM laufen dev