Angular cli最新版本的Angular material问题_Angular_Angular Material

Angular cli最新版本的Angular material问题

angular angular-material

Angular cli最新版本的Angular material问题,angular,angular-material,Angular,Angular Material,我正在尝试用角材质创建导航栏。因此，我从几个设置开始： 1）我用npm安装了角材料 2）我在style.css中配置了主题，如下所示： /* You can add global styles to this file, and also import other style files */ @import '~@angular/material/prebuilt-themes/deeppurple-amber.css'; @import '~https://fonts.googleapi

我正在尝试用角材质创建导航栏。因此，我从几个设置开始：

1）我用npm安装了角材料 2）我在style.css中配置了主题，如下所示：

/* You can add global styles to this file, and also import other style files */
@import '~@angular/material/prebuilt-themes/deeppurple-amber.css';
@import '~https://fonts.googleapis.com/icon?family=Material+Icons';

<link href="../node_modules/@angular/material/prebuilt-themes/indigo-pink.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

3）我将角度材质主题链接到index.html，如下所示：

/* You can add global styles to this file, and also import other style files */
@import '~@angular/material/prebuilt-themes/deeppurple-amber.css';
@import '~https://fonts.googleapis.com/icon?family=Material+Icons';

<link href="../node_modules/@angular/material/prebuilt-themes/indigo-pink.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

但是当运行ng serve时，我得到如下所述的错误：

'C:\Angular Projects\admin portal\src' 在doResolve（C:\Angular Projects\admin portal\node\u modules\enhanced resolve\lib\Resolver.js:180:19）在hook.callAsync（C:\Angular Projects\admin portal\node\u modules\enhanced resolve\lib\Resolver.js:238:5）在_fn0（在创建时进行评估（C:\Angular Projects\admin portal\node\u modules\tapable\lib\HookCodeFactory.js:32:10）， :15:1) 位于resolver.doResolve（C:\Angular Projects\admin portal\node\u modules\enhanced resolve\lib\unsafeccheplugin.js:37:5）在hook.callAsync（C:\Angular Projects\admin portal\node\u modules\enhanced resolve\lib\Resolver.js:238:5）在_fn0（在创建时进行评估（C:\Angular Projects\admin portal\node\u modules\tapable\lib\HookCodeFactory.js:32:10）， :15:1) 在hook.callAsync（C:\Angular Projects\admin portal\node\u modules\enhanced resolve\lib\Resolver.js:238:5）在_fn0（在创建时进行评估（C:\Angular Projects\admin portal\node\u modules\tapable\lib\HookCodeFactory.js:32:10）， :12:1) 位于resolver.doResolve（C:\Angular Projects\admin portal\node\u modules\enhanced resolve\lib\DescriptionFilePlugin.js:42:38）在hook.callAsync（C:\Angular Projects\admin portal\node\u modules\enhanced resolve\lib\Resolver.js:238:5）在_fn5（在创建时评估（C:\Angular Projects\admin portal\node\u modules\tapable\lib\HookCodeFactory.js:32:10）， :57:1) 位于resolver.doResolve（C:\Angular Projects\admin portal\node\u modules\enhanced resolve\lib\ModuleKindPlugin.js:23:37）在hook.callAsync（C:\Angular Projects\admin portal\node\u modules\enhanced resolve\lib\Resolver.js:238:5）在_fn0（在创建时进行评估（C:\Angular Projects\admin portal\node\u modules\tapable\lib\HookCodeFactory.js:32:10）， :15:1) 在hook.callAsync（C:\Angular Projects\admin portal\node\u modules\enhanced resolve\lib\Resolver.js:238:5）在_fn1（在创建时评估（C:\Angular Projects\admin portal\node\u modules\tapable\lib\HookCodeFactory.js:32:10），：24:1）

它不起作用的原因是，当您应该使用

url

函数时，您指定了路径是本地的。（另外，您两次都指定了主题和字体，您应该在

index.html

文件或
styles.css
文件中指定它们，而不是在这两个文件中指定它们）
您可以使用以下配置或其他配置：

样式.css中的所有导入： @import'~@angular/material/prebuild themes/indigo pink.css'； @导入url（'https://fonts.googleapis.com/icon?family=Material+图标“）；
index.html中的所有导入：我遵循了中提到的步骤，但他们没有指定我应该在style.css中导入google API字体的材料和图标。感谢您的帮助