在Angular 8中,可以使用Angular CLI的styles配置来加载外部CSS或SCSS文件。以下是一种解决方法:
styles的文件夹。styles文件夹中。例如,假设有一个名为styles.css的CSS文件。angular.json文件中找到architect -> build -> options部分,并在其下添加以下内容:"styles": [
"src/styles.css",
"src/styles/styles.css"
]
这将添加src/styles.css和src/styles/styles.css这两个文件到构建过程中。
注意:如果你的文件是SCSS文件而不是CSS文件,则需要将文件扩展名从.css更改为.scss。
app.component.ts的组件中,将以下代码添加到组件的装饰器中:@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css', './app.component.scss']
})
这样,styles.css和styles.scss文件将被加载并应用于app.component.html模板。
请注意,如果使用的是SCSS文件,则需要安装node-sass依赖项。在项目根目录中运行以下命令来安装它:
npm install node-sass --save-dev
这样,Angular 8就能够模块化加载外部CSS或SCSS文件了。