How to use MaterializeCSS in Angular 2

I really want to use materializecss in Angular2 .

I followed the steps from

https://www.npmjs.com/package/angular2-materialize .

I am still learning Angular2 and using angular-cli . But I do not know where to add the bec plugin.

I do not know where the web package is located. And I also tried to follow these steps https://medium.com/@ladyleet/using-materializecss-with-your-angular-2-angular-cli-app-2eb64b05a1d2#.cpgjvvo7m

but i don't know where angular-cli-build.js?

oh, btw I'm using angular-cli . Hope there is someone there who can help me.

I really like materializecss . I always use it when I use AngularJS.

Thank.

+4
source share
3 answers

You can import the css file into your main file styles.sasslike this.

// override fonts path to prevent build errors (or use resolve-url loader)
$roboto-font-path: "../node_modules/materialize-css/fonts/roboto/"

// optionally override color variables eg: ...
$primary-color: color("materialize-purple");

@import "~materialize-css/sass/materialize"
+3
source

Even I tried to materialize css with the angular-cli project following the instructions of MaterializeCss and it works. The steps that I followed are as follows:

Install jquery, materialize-css and angular2 -materialize

Add jquery and materialize in angular-cli script

  "scripts": [
   "../node_modules/jquery/dist/jquery.js",
   "../node_modules/materialize-css/dist/js/materialize.js"
  ]

Add materialize.css file to angular-cli

 "styles": [
 "../node_modules/materialize-css/dist/css/materialize.css"
 ]

Finally, import the MaterializeModule into app.module.ts

 import { MaterializeModule } from 'angular2-materialize';
 @NgModule({
  imports: [
   MaterializeModule
  ]
 })
+2
source

Source: https://habr.com/ru/post/1668259/


All Articles