我将 ASP.NET MVC 作为服务器,将 Angular 作为客户端应用程序。
我没有静态 index.html,但它是 index.cshtml。我使用的样式是全局样式,不是组件范围的。
我的问题是如何使用 angular/webpack 和 MVC 处理 scss 样式文件(一堆)?
我是否必须在 app.component 文件中手动导入“全局样式文件”?我是否对像 Bootstrap 这样的 vendor css 文件做同样的事情?
最佳做法是什么?我的想法如下:
import { Component } from '@angular/core';
import '../styles/myglobalStyles.css'
import '../styles/boostrap.min.css'
import '../styles/otherVendors.min.css'
@Component({
selector: 'my-app',
templateUrl: './app.component.html'
})
export class AppComponent { }
另一个问题是在 ANGULAR CLI 设置中,所做的是在 angular-cli.json
文件中添加以下内容。它有什么作用?它会在构建过程中将 styles.css 文件添加到 app.component.html 吗? (你能指出任何来源/文档吗?)
],
"styles": [
"src/styles.css"
],
最佳答案
您应该使用 webpack 捆绑所有 scss 文件并将所有 scss 文件转换为 css,然后将其提取到文件调用 lib.css,然后将其包含在 Layout.cshtml 中,因为它是您应用程序的全局样式。也许要改进你可以使用第三方库来丑化你的 css 代码也可以提高性能
干杯
关于css - 如何在非 cli Angular 元素中使用全局 css?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56165425/