CODEWITHSUNDEEP
laravellaravel-5webpackbourbonlaravel-mix
daniel8x
daniel8x

Reputation: 1080

Can not run npm using Laravel-mix

I am having some issue, its killing me. please help. I am trying to run npm in DEV using command: npm run dev

In my webconfig.mix.js : mix.sass('resources/assets/sass/style.scss', 'public/css');

This is errors that i got

 95% emitting

 ERROR  Failed to compile with 4 errors                                                                                                                                                                                               05:33:52

This dependency was not found:

* -!../../../node_modules/css-loader/index.js?{"url":true,"sourceMap":false,"importLoaders":1}!../../../node_modules/postcss-loader/lib/index.js??postcss!bootstrap/dist/bootstrap.css in ./node_modules/css-loader?{"url":true,"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"sourceMap":true,"ident":"postcss","plugins":[null]}!./node_modules/resolve-url-loader?{"sourceMap":true,"root":"/home/vagrant/Code/pudatalk/node_modules"}!./node_modules/sass-loader/lib/loader.js?{"precision":8,"outputStyle":"expanded","sourceMap":true}!./resources/assets/sass/style.scss

To install it, you can run: npm install --save -!../../../node_modules/css-loader/index.js?{"url":true,"sourceMap":false,"importLoaders":1}!../../../node_modules/postcss-loader/lib/index.js??postcss!bootstrap/dist/bootstrap.css

Please see the error above.

So, i found out that its happening when i import :

@import "~bourbon/app/assets/stylesheets/_bourbon.scss";

and i implemented something like : 

.error-bg-img {
    background:url("../img/errorbg.jpg");
    background-size:cover;
}

I am trying to tell you what i had in the code that occur the problem.

I have been trying google it, reinstall so many things, move things around but hopeless. I am a newbie in sass, webpack, and laravel-mix.

Thanks so much

Upvotes: 0

Views: 702

Answers (2)

daniel8x
daniel8x

Reputation: 1080

Alright guys,

I fixed the problem, i didn't now that webpack will automaticly copy the image in /img folder to /public. So i moved my /img from public/ folder to /resources/assests/. And everything is fine now.

Its all about the path. Sorry i am pretty new with webpack and didn't know about that.

Upvotes: 1

Ru Chern Chong
Ru Chern Chong

Reputation: 3756

@import "bourbon/bourbon";

Have a look at the installation guideline here: https://github.com/thoughtbot/bourbon#requirements

Upvotes: 0

Related Questions