Closed PabloG6 closed 4 years ago
@PabloG6 I'd recommend filing an issue upstream in material-components-web; if it's related to usage or a problem with MDC's Sass module system the maintainers are the best source for help.
We can always re-open if needed.
When customizing the typography styles, sometimes the sass compiler will throw an error which states.
ERROR in ./src/styles.scss (./node_modules/@angular-devkit/build-angular/src/angular-cli-files/plugins/raw-css-loader.js!./node_modules/postcss-loader/src??embedded!./node_modules/sass-loader/dist/cjs.js??ref--15-3!./src/styles.scss) Module build failed (from ./node_modules/sass-loader/dist/cjs.js): SassError: This module was already loaded, so it can't be configured using "with". ╷ 3 │ @forward "./functions"; │ ^^^^^^^^^^^^^^^^^^^^^^ ╵ node_modules/@material/typography/_index.scss 3:1 @use src/styles/components/_typography.scss 2:1 @use /mnt/c/Users/Public/angular-projects/attolink/src/styles.scss 2:1 root stylesheet
typography.scss file
@use "./component-variables";
@use "@material/typography" with (
$font-family: unquote("Cousine, sans-serif"),
$mdc-typography-styles-headline1: component-variables.$mdc-typography-styles-headline1,
$mdc-typography-styles-headline2: component-variables.$mdc-typography-styles-headline2,
$mdc-typography-styles-headline3: component-variables.$mdc-typography-styles-headline3,
);
my styles.scss file
@use "components/typography";
@use "@material/theme" with ($primary: #6002ee, $secondary: #fff);
@use "@angular-mdc/theme/material";
Expected Behavior
The typography components should be changed to display the selected font family.
Environment ~angular-mdc/web@5.1.0 @angular-devkit/architect 0.900.3 @angular-devkit/build-angular 0.900.3 @angular-devkit/build-optimizer 0.900.3 @angular-devkit/build-webpack 0.900.3 @angular-devkit/core 9.0.3 @angular-devkit/schematics 9.0.3 @angular/cdk 9.1.0 @angular/cli 9.0.3 @ngtools/webpack 9.0.3 @schematics/angular 9.0.3 @schematics/update 0.900.3 rxjs 6.5.4 typescript 3.7.5 webpack 4.41.2