angular - 将 MDC SASS 文件添加到 Angular 4 项目

Question

如何将 MDC 组件 sass 文件导入我的 Angular 4 项目？编译器无法编译 .scss 文件，因为它们的@import语句不是相对的——它们只是指向.scss 文件@material。例如，这里是 mdc-button.scss@import语句：

@import "@material/animation/variables";
@import "@material/animation/functions";
@import "@material/elevation/mixins";
@import "@material/ripple/mixins";
@import "@material/theme/mixins";
@import "@material/typography/mixins";

这使编译器失败，因为它无法找到@material，因为文件在node_modules/@material/button/mdc-button.scss里面所以它实际上需要@import "../animation/variables"等等。

该库位于https://github.com/material-components/material-components-web/

Answer 1

根据您的 sass 工具（我使用的是 Koala），您必须将其他路径信息添加到您的 sass 配置中：

// Sass project settings, you can edit it and set custom settings.
// An array of filesystem paths or importers which should be searched for     
//Sass templates imported with the @import directive. (I am on windows it might be 
//different for other O/S)

"includePaths": ["C:\\Users\\loggedInUser\\node_modules"],
    "requireLibs": []