Question

在网上按照说明进行操作时出现错误 https://material.angular.io/guide/theming

./ src / styles.scss中的错误（./node_modules/raw-loader!./node_modules/postcss-loader/lib？嵌入！./ node_modules / sass-loader / lib / loader.js ?? ref --14-3！./ src / styles.scss）模块构建失败： @import'〜@ material / theme'; ^ 找不到或无法读取的导入文件：〜@ material / theme。在D：\ Practice \ angular \ styles.scss（第1行，第1列）中

我不知道为什么找不到素材/主题或为什么无法导入，因为我在node_modules文件下看到@ material / theme。

@import '~@material/theme';

// always include only once per project
@include mat-core();

// import our custom themes
@import 'my-theme.scss';
@import 'my-light-theme.scss';
@import 'my-dark-theme.scss';

.my-theme {
  @include angular-material-theme($my-theme);
}

// additional css classes
// you can hardcode one of them on the <body> tag 
// or switch dynamically during runtime with [class]
.my-light-theme {
  @include angular-material-theme($my-light-theme);
}

.my-dark-theme {
  @include angular-material-theme($my-dark-theme);
}

Answer 1

导入路径不正确，应为：

@import '~@angular/material/theming';

您可以看到here more information。

Answer 2

尝试以这种方式访问_theming.scss文件（更改路径以匹配您的文件）：

@import "../../../node_modules/@angular/material/_theming";

我也使用NPM node-sass 尝试了@import '~@angular/material/theming';，并以这种方式得到了错误...

Answer 3

尝试不带扩展名的文件名

@import '@angular/material/_theming.scss';

@import'〜@ material / theme';在sytles.css中无法正常工作

3 个答案: