如何构建 ng2-material v0.8.1 示例站点

Question

我想启动 ng2-material this site in my local machine using this 文档。首先，我使用 angular-cli ng new myProject 命令在本地创建了新项目。

但现在我不知道下一步该做什么？

文档说：

但是当我在 myProject 目录中执行 grunt build-npm 命令时，出现 Fatal error: Unable to find Gruntfile. 错误。

已编辑：

我试过了：

克隆他们的存储库：https://github.com/justindujardin/ng2-material.git
cd ./ng2-material
运行在根目录下安装 npm
运行 grunt build-npm
光盘./modules/site
运行 npm 安装
运行服务

第 7 步

首先我将 angular-cli 降级到 1.0.0.beta10 因为 ng2-material 0.8.1 不想与 angular-cli 1.0.0.beta21.

一起工作

ng-serve 命令后出现问题（没有导出 mng 'MATERIAL_DIRECTIVES'）：

The Broccoli Plugin: [BroccoliTypeScriptCompiler] failed with:
Error: Typescript found the following errors:
  /home/user/4learn/ng2-material/modules/site/tmp/broccoli_type_script_compiler-input_base_path-0tzJEdmQ.tmp/0/src/app/+components/components.component.ts (3, 9): Module '"/home/user/4learn/ng2-material/modules/site/node_modules/ng2-material/index"' has no exported mng 'MATERIAL_DIRECTIVES'

.

Answer 1

如果您想在本地测试 ng2-material 示例，您应该使用他们的项目源，而不是创建新的自定义项目。

克隆他们的存储库：git@github.com:justindujardin/ng2-material.git
cd ./ng2-material
运行 npm install 在根目录
运行 grunt build-npm
cd ./modules/site
运行 npm install
运行 ng serve

如果您只想在自己的项目中使用 ng2-material，请按照此处的说明操作：https://justindujardin.github.io/ng2-material/#/

安装 ng2-material 和 material2 核心库：

npm install --save ng2-material @angular2-material/core

然后导入 material 指令和提供程序

import {MATERIAL_DIRECTIVES, MATERIAL_PROVIDERS} from "ng2-material";

然后在您的页面中引用样式

<link rel="stylesheet" href="node_modules/ng2-material/ng2-material.css">
<link rel="stylesheet" href="node_modules/ng2-material/font/font.css">

如果您只想使用基本的 material 组件，您应该查看这个官方项目：https://github.com/angular/material2

如何构建 ng2-material v0.8.1 示例站点

how to build ng2-material v0.8.1 example site

gruntjs

angular-material

angular-cli

angular

已编辑：

第 7 步