Import styles mdb.pro.scss


Topic: Import styles mdb.pro.scss

Bochagova pro premium priority asked 2 years ago

Hello.I update my app for MDB Angular 4 up to MDB Angular 5.When I add in angular.json -> styles -> "../../../node_modules/ng-ui-kit/assets/scss/mdb.pro.scss", I got next error

../../../node_modules/ng-ui-kit/assets/scss/mdb.pro.scss - Error: Module build failed (from ../../../node_modules/sass-loader/dist/cjs.js):SassError: Can't find stylesheet to import. ╷ 9 │ @import './pro/animate'; │ ^^^^^^^^^^^

Can u help me with this?


Grzegorz Bujański staff answered 2 years ago

Try importing mdb.scss instead of mdb.pro.scss.


Bochagova pro premium priority commented 2 years ago

if I importing mdb.scss, I have message ../../../node_modules/ng-ui-kit/assets/scss/mdb.scss.webpack[javascript/auto]!=!../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[5].rules[0].oneOf[0].use[1]!../../../node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[5].rules[0].oneOf[0].use[2]!../../../node_modules/resolve-url-loader/index.js??ruleSet[1].rules[5].rules[1].use[0]!../../../node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[5].rules[1].use[1]!../../../node_modules/ng-ui-kit/assets/scss/mdb.scss - Warning: Module Warning (from ../../../node_modules/postcss-loader/dist/cjs.js):


Grzegorz Bujański staff commented 2 years ago

Unfortunately, I am not able to reproduce this error. Please describe exactly how you added our library and how we can reproduce this. Additionally, now I noticed that you import this from node_modules/ng-ui-kit. Are you sure you installed our package correctly? After installing MDB5, node modules should contain the mdb-angular-ui-kit folder, not ng-ui-kit.


Bochagova pro premium priority commented 2 years ago

I renamed and now I have ../../../node_modules/mdb-angular-ui-kit/assets/scss/mdb.scss.webpack[javascript/auto]!=!../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[5].rules[0].oneOf[0].use[1]!../../../node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[5].rules[0].oneOf[0].use[2]!../../../node_modules/resolve-url-loader/index.js??ruleSet[1].rules[5].rules[1].use[0]!../../../node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[5].rules[1].use[1]!../../../node_modules/mdb-angular-ui-kit/assets/scss/mdb.scss - Warning: Module Warning (from ../../../node_modules/postcss-loader/dist/cjs.js):

my package.json "@angular/animations": "^14.2.8", "@angular/cdk": "^14.2.6", "@angular/common": "^14.2.8", "@angular/compiler": "^14.2.8", "@angular/core": "^14.2.8", "@angular/forms": "^14.2.8", "@angular/platform-browser": "^14.2.8", "@angular/platform-browser-dynamic": "^14.2.8", "@angular/router": "^14.2.8","mdb-angular-ui-kit": "git+https://*@git.mdbootstrap.com/mdb/angular/mdb5/prd/mdb5-angular-ui-kit-pro-essential",


Arkadiusz Idzikowski staff commented 2 years ago

Did you follow all the steps from our installation guide?

https://mdbootstrap.com/docs/angular/pro/installation/#section-advanced-installation

Please make sure to choose SCSS stylesheets in your Angular app configuration as mentioned in the step 1.


Please insert min. 20 characters.

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: Yes
  • Technology: MDB Angular
  • MDB Version: MDB5 3.0.0
  • Device: notebook
  • Browser: chrome
  • OS: win 11
  • Provided sample code: No
  • Provided link: No