角度 4 在文档的头部.css加载圆圈

Question

我正在使用 Angular 4，我想使用 cssscript 中的圆.css。 我从链接下载文件，将圆圈.css放在我的东西组件文件中，但是当我使用
<link rel="stylesheet" href="circle.css">

在我的东西组件.html。

我收到错误：

区域.js：654 未处理的承诺拒绝：加载圆圈失败.css ;区：;任务：承诺;值：无法加载圆圈.css 未定义* 我需要遵循哪些正确的步骤才能使用 CSS 文件圈.css在我的组件中？？

Answer 1

我对你的架构一无所知，但是，假设你正在使用Angular-CLI，并且你已经编写了ng generate component testComponent --module app命令

现在，您的项目中应该在测试组件文件夹下有一些文件：

• test-component.component.ts
• test-component.component.html
• test-component.component.css
• test-component.component.spec.ts

文件：test-component.component.ts

import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-test-component',
templateUrl: './test-component.component.html',
styleUrls: ['./test-component.component.css']
})
export class TestComponentComponent implements OnInit {
constructor() { }
ngOnInit() {
}
}

因此，您可以在"测试组件"文件夹中点击目标导入 circle.css 文件，并添加到 styleUrls 组件列表中styleUrls: ['./test-component.component.css','./circle.css']

希望对你有帮助

Answer 2

您必须使用该文件的相对路径，Webpack 会考虑如何为您解析绝对路径。 如果文件存在于同一文件夹中，请尝试使用./circle.css代替circle.css，如果它位于同级样式文件夹中，您可以写../styles/circle.css。