MDB-Angular PRO Install errors

Topic: MDB-Angular PRO Install errors

Atha pro asked 6 years ago

Hi there, I am having an issue with the install/run of MDB Pro on Angular 6. I have listed the error message below:

WARNING in ./src/styles.scss (./node_modules/raw-loader!./node_modules/postcss-loader/lib??embedded!./node_modules/sass-loader/lib/loader.js??ref--14-3!./src/styles.scss)(Emitted value instead of an instance of Error) postcss-url: /Users/jonathan/Sites/websites/thepacificdifference-v2/node_modules/ng-uikit-pro-standard/assets/scss/pro/_lightbox.scss:267:2: Can\'t read file \'/Users/jonathan/Sites/websites/thepacificdifference-v2/img/lightbox/default-skin.png\', ignoring

WARNING in ./src/styles.scss (./node_modules/raw-loader!./node_modules/postcss-loader/lib??embedded!./node_modules/sass-loader/lib/loader.js??ref--14-3!./src/styles.scss)(Emitted value instead of an instance of Error) postcss-url: /Users/jonathan/Sites/websites/thepacificdifference-v2/node_modules/ng-uikit-pro-standard/assets/scss/pro/_lightbox.scss:280:4: Can\'t read file \'/Users/jonathan/Sites/websites/thepacificdifference-v2/img/lightbox/default-skin.svg\', ignoring

WARNING in ./src/styles.scss (./node_modules/raw-loader!./node_modules/postcss-loader/lib??embedded!./node_modules/sass-loader/lib/loader.js??ref--14-3!./src/styles.scss)(Emitted value instead of an instance of Error) postcss-url: /Users/jonathan/Sites/websites/thepacificdifference-v2/node_modules/ng-uikit-pro-standard/assets/scss/pro/_lightbox.scss:589:4: Can\'t read file \'/Users/jonathan/Sites/websites/thepacificdifference-v2/img/lightbox/preloader.gif\', ignoring

ERROR in ./src/styles.scss (./node_modules/raw-loader!./node_modules/postcss-loader/lib??embedded!./node_modules/sass-loader/lib/loader.js??ref--14-3!./src/styles.scss)(Emitted value instead of an instance of Error) CssSyntaxError: /Users/jonathan/Sites/websites/thepacificdifference-v2/node_modules/ng-uikit-pro-standard/assets/scss/pro/_lightbox.scss:267:14: Can\'t resolve \'../img/lightbox/default-skin.png\' in \'/Users/jonathan/Sites/websites/thepacificdifference-v2/src\'

265 | .pswp__button--arrow--left:before,
266 | .pswp__button--arrow--right:before {
> 267 |   background: url(../img/lightbox/default-skin.png) 0 0 no-repeat;      |              ^
268 |   background-size: 264px 88px;  269 |   width: 44px;

ERROR in ./src/styles.scss (./node_modules/raw-loader!./node_modules/postcss-loader/lib??embedded!./node_modules/sass-loader/lib/loader.js??ref--14-3!./src/styles.scss)(Emitted value instead of an instance of Error) CssSyntaxError: /Users/jonathan/Sites/websites/thepacificdifference-v2/node_modules/ng-uikit-pro-standard/assets/scss/pro/_lightbox.scss:280:22: Can\'t resolve \'../img/lightbox/default-skin.svg\' in \'/Users/jonathan/Sites/websites/thepacificdifference-v2/src\'
278 |   .pswp--svg .pswp__button--arrow--left:before,
279 |   .pswp--svg .pswp__button--arrow--right:before {
> 280 |     background-image: url(../img/lightbox/default-skin.svg);      |                      ^
281 |   }
282 |   .pswp--svg .pswp__button--arrow--left,

ERROR in ./src/styles.scss (./node_modules/raw-loader!./node_modules/postcss-loader/lib??embedded!./node_modules/sass-loader/lib/loader.js??ref--14-3!./src/styles.scss)(Emitted value instead of an instance of Error) CssSyntaxError: /Users/jonathan/Sites/websites/thepacificdifference-v2/node_modules/ng-uikit-pro-standard/assets/scss/pro/_lightbox.scss:589:16: Can\'t resolve \'../img/lightbox/preloader.gif\' in \'/Users/jonathan/Sites/websites/thepacificdifference-v2/src\'
587 |   .pswp__preloader__icn {
588 |     /* We use .gif in browsers that don\'t support CSS animation */
> 589 |     background: url(../img/lightbox/preloader.gif) 0 0 no-repeat;      |                ^
590 |   }
591 | }

I temporarily solved this by commenting out the following in mdb.scss

// @import \"pro/lightbox\";

However, this will not work for us in deployment.

Can anyone help me determine how can we resolve this issue without modifying node files?

-- NORMAL --

Add comment

Damian Gemza staff answered 6 years ago

0 0 Best answer

Dear Atha,
That's strange. I didn't saw that error while testing package...
For a workaround of this problem:

Please open

node_modules/ng-uikit-pro-standard/assets/scss/core/_variables.scss,

and change line 154 ($image-path) from

$image-path: "../img/" !default;

 $image-path: "../../img/" !default;

Best Regards,

Damian

Add comment

Atha pro answered 6 years ago

0 0 Best answer

Thanks, Unfortunately, I tried your solution this morning and it still did not work. Strange that this issue has not arisen before. I have experienced the issue on multiple computers, and multiple installs. WARNING in ./src/styles.scss (./node_modules/raw-loader!./node_modules/postcss-loader/lib??embedded!./node_modules/sass-loader/lib/loader.js??ref--14-3!./src/styles.scss) (Emitted value instead of an instance of Error) postcss-url: /Users/jonathan/Sites/websites/thepacificdifference-v2/node_modules/ng-uikit-pro-standard/assets/scss/pro/_lightbox.scss:267:2: Can't read file '/Users/jonathan/Sites/websites/thepacificdifference-v2/img/lightbox/default-skin.png', ignoring WARNING in ./src/styles.scss (./node_modules/raw-loader!./node_modules/postcss-loader/lib??embedded!./node_modules/sass-loader/lib/loader.js??ref--14-3!./src/styles.scss) (Emitted value instead of an instance of Error) postcss-url: /Users/jonathan/Sites/websites/thepacificdifference-v2/node_modules/ng-uikit-pro-standard/assets/scss/pro/_lightbox.scss:280:4: Can't read file '/Users/jonathan/Sites/websites/thepacificdifference-v2/img/lightbox/default-skin.svg', ignoring WARNING in ./src/styles.scss (./node_modules/raw-loader!./node_modules/postcss-loader/lib??embedded!./node_modules/sass-loader/lib/loader.js??ref--14-3!./src/styles.scss) (Emitted value instead of an instance of Error) postcss-url: /Users/jonathan/Sites/websites/thepacificdifference-v2/node_modules/ng-uikit-pro-standard/assets/scss/pro/_lightbox.scss:589:4: Can't read file '/Users/jonathan/Sites/websites/thepacificdifference-v2/img/lightbox/preloader.gif', ignoring ERROR in ./src/styles.scss (./node_modules/raw-loader!./node_modules/postcss-loader/lib??embedded!./node_modules/sass-loader/lib/loader.js??ref--14-3!./src/styles.scss) (Emitted value instead of an instance of Error) CssSyntaxError: /Users/jonathan/Sites/websites/thepacificdifference-v2/node_modules/ng-uikit-pro-standard/assets/scss/pro/_lightbox.scss:267:14: Can't resolve '../img/lightbox/default-skin.png' in '/Users/jonathan/Sites/websites/thepacificdifference-v2/src' 265 | .pswp__button--arrow--left:before, 266 | .pswp__button--arrow--right:before { > 267 | background: url(../img/lightbox/default-skin.png) 0 0 no-repeat; | ^ 268 | background-size: 264px 88px; 269 | width: 44px; ERROR in ./src/styles.scss (./node_modules/raw-loader!./node_modules/postcss-loader/lib??embedded!./node_modules/sass-loader/lib/loader.js??ref--14-3!./src/styles.scss) (Emitted value instead of an instance of Error) CssSyntaxError: /Users/jonathan/Sites/websites/thepacificdifference-v2/node_modules/ng-uikit-pro-standard/assets/scss/pro/_lightbox.scss:280:22: Can't resolve '../img/lightbox/default-skin.svg' in '/Users/jonathan/Sites/websites/thepacificdifference-v2/src' 278 | .pswp--svg .pswp__button--arrow--left:before, 279 | .pswp--svg .pswp__button--arrow--right:before { > 280 | background-image: url(../img/lightbox/default-skin.svg); | ^ 281 | } 282 | .pswp--svg .pswp__button--arrow--left, ERROR in ./src/styles.scss (./node_modules/raw-loader!./node_modules/postcss-loader/lib??embedded!./node_modules/sass-loader/lib/loader.js??ref--14-3!./src/styles.scss) (Emitted value instead of an instance of Error) CssSyntaxError: /Users/jonathan/Sites/websites/thepacificdifference-v2/node_modules/ng-uikit-pro-standard/assets/scss/pro/_lightbox.scss:589:16: Can't resolve '../img/lightbox/preloader.gif' in '/Users/jonathan/Sites/websites/thepacificdifference-v2/src' 587 | .pswp__preloader__icn { 588 | /* We use .gif in browsers that don't support CSS animation */ > 589 | background: url(../img/lightbox/preloader.gif) 0 0 no-repeat; | ^ 590 | } 591 | }

-- NORMAL --

Atha pro commented 6 years ago

Hello Damian, Its been referenced with a variable properly on node-modules/ng-uikit-pro-standard/assets/scss/angular/pro/_lightbox.scss file but the reference is wrong on this file node-modules/ng-uikit-pro-standard/assets/scss/pro/_lightbox.scss file and its not using the variable. How soon can this be fixed on your end and propagated to standard version for our use? Thanks.

Damian Gemza staff commented 6 years ago

Dear Atha, Could you please try to download ng-uikit-pro-standard library from our GitLab dev branch, and check if it works? The problem with url's in node-modules/ng-uikit-pro-standard/assets/scss/pro/_lightbox.scss should be resolved with 6.1.5 release of MDB Angular. Please let me know if dev branch solves your problem. Best Regards, Damian

Add comment

Write

Create snippet

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

User: Pro
Premium support: No
Technology: MDB Angular
MDB Version: -
Device: -
Browser: -
OS: -
Provided sample code: Yes
Provided link: No

About author

Atha

Pro User

10Support score
1Questions 1Answers

0Snippets likes 0Snippets