2

我正在尝试将 Material Components Web(MDC-Web) sass 功能与 ember-cli-sass 一起使用。我已经用 Yarn 安装了 MDC-Web

在我的 ember-cli-build.js 文件中，我将 sass includePaths 设置为：

 sassOptions: {
           includePaths: ['node_modules/material-components-web','node_modules/@material']      
    }

然后在我的 app.scss 文件中尝试导入完整的组件库，如下所示：

@import "material-components-web";

但是我收到了错误：

错误：错误：找不到或无法读取要导入的文件：@material/button/mdc-button。

为什么 SASS 编译器找不到它？

4

2 回答 2

2

这个问题也让我第一次开始。我已经在我的ember 应用程序中使用它几个月了，这在我的 app.scss 中对我有用

// Parent MDC Theming example

$mdc-theme-primary: #009688;
$mdc-theme-secondary: #00bcd4;
$mdc-theme-background: #fff;

@import "material-components-web/material-components-web";

// Overrides to follow example

.mdc-grid-tile__secondary{
    background-color: rgba(0, 150, 136, 0.75);
}
.mdc-list-item{
    white-space: unset;
    overflow: visible;
}

在 ember-cli-build 中

sassOptions: {
  includePaths: [
    'node_modules'
  ]
}
于 2018-01-04T01:14:46.440 回答
0

在 ember 中，您必须在ember-cli.build.js. 请参阅https://guides.emberjs.com/v2.18.0/addons-and-dependencies/managing-dependencies。从 2.15 开始，也可以从 node_modules ( https://discuss.emberjs.com/t/import-javascripts-from-node-modules-packages/13606 ) 导入。

但在material-components-web这种情况下，根本没有必要。相反，您可以简单地使用为您提供的 ember 插件ember -material-components-web material-components-web。

于 2018-01-03T21:52:15.427 回答