如何在Angular 2中使用MaterialiseCSS

Question

我真的想在Angular2中使用materializecss.

我按照步骤进行操作

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

我还在研究Angular2并使用angular-cli.但我不知道在哪里添加插件.

我不知道webpack在哪里.我也试着按照这个步骤进行操作 https://medium.com/@ladyleet/using-materializecss-with-your-angular-2-angular-cli-app-2eb64b05a1d2#.cpgjvvo7m

但我不知道在哪里angular-cli-build.js？

哦,顺便说一句,我正在使用angular-cli.我希望有人可以帮助我.

我非常喜欢materializecss.当我使用AngularJS时,我总是使用它.

谢谢.

Answer 1

这个仓库的答案：https : //github.com/stanleyeosakul/angular-travelville

设置实体化CSS

1. 运行yarn add materialize-css@next（或npm i materialize-css@next）

2. 将Materialize CSS添加到.angular-cli.json（或angular.json）中

   json // .angular-cli.json { "apps": [ { ... "styles": [ "../node_modules/materialize-css/dist/css/materialize.min.css", "styles.css" ], "scripts": [ "../node_modules/materialize-css/dist/js/materialize.min.js" ], ... } ] }

3. 在中声明M变量./src/typings.d.ts（或自行创建文件）

   typescript declare var M;

4. Materialize CSS现在已集成到Angular中！

Answer 2

即使我尝试使用 angular-cli 项目来实现 css，遵循MaterializeCss的说明，并且它正在工作。我遵循的步骤是：

安装 jquery、materialize-css 和 angular2-materialize

在 Angular-CLI 脚本中添加 jquery 和 Materialize

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

在 angular-cli 中添加 Materialize.css

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

最后在app.module.ts中导入MaterializeModule

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