Angular Material主题编译失败求助：无法解析预构建主题文件

Looks like you’ve hit a common typo issue in your theme import path! Let’s break down the fixes step by step:

1. Correct the Typo in the Theme Filename #

The error message points to indogo-pink.css, but the actual prebuilt theme filename is indigo-pink.css (note the correct spelling of "indigo" instead of "indogo"). Update your style.css import line to:

@import "~@angular/material/prebuilt-themes/indigo-pink.css";

2. Verify Angular Material Installation #

If the typo fix doesn’t resolve the issue, double-check that Angular Material is properly installed in your project. Run this command in your project root to ensure it’s added:

npm install @angular/material @angular/cdk

3. Confirm the Theme File Exists in node_modules #

Navigate to your project’s node_modules/@angular/material/prebuilt-themes directory and make sure indigo-pink.css is present. If it’s missing, reinstalling Angular Material should fix this.

4. Check Angular CLI Version Compatibility #

Ensure your Angular CLI version is compatible with the installed Angular Material version. You can check your CLI version with:

ng version

If there’s a mismatch, consider updating your CLI or Material package to matching versions.

After making these changes, restart your development server (ng serve) and the compilation error should be resolved.

内容的提问来源于stack exchange，提问作者Adynh