在基于子域的角度应用程序上加载 css答案

【问题标题】：Load css on angular application based on subdomain在基于子域的角度应用程序上加载 css
【发布时间】：2019-01-16 11:03:13
【问题描述】：

待办事项：

基于加载的子域的 css 文件。
例如：我有 abc.css、xyz.css，这些 css 应该基于子域加载，例如如果 abc 则必须加载 abc.css 等等。

案例：

从 angular-cli.json 动态加载 css（找不到方法动态加载）
在 index.html 上加载 css（遇到 MiME 类型问题）
在应用初始化时使用样式加载器，例如 require("style-loader!./style.css");

使用的版本： Angular 4.4.6 版本。

谁能帮我解决这个问题？
我愿意接受所有建议，请提出建议。

谢谢。

【问题讨论】：

标签： css angular webpack angular-cli subdomain

【解决方案1】：

试试这个：

在 HTML 模板中：
<link rel="stylesheet" [href]="getCssUrl()">

在component.ts中：

constructor (private sanitizer: DomSanitizer) {}

getCssUrl() {
    // Implement your code to return CSS url based on sub-domain
    const cssURL = xxx;
    return sanitizer.bypassSecurityTrustResourceUrl(cssUrl);
}

【讨论】：

遇到的问题：资源 URL 上下文中使用的值不安全.. 从函数返回“../custom.css”时。
使用 DomSanitier 将解决上述问题，但遇到了另一个问题：拒绝应用来自 'localhost:4200/custom.css' 的样式，因为它的 MIME 类型 ('text/html') 不是受支持的样式表 MIME 类型，并且严格MIME 检查已启用。
如果 dom-sanitizer 没有帮助，那么您可以在 github 上参考此问题：github.com/angular/angular-cli/issues/… 另外，如果您可以使用渲染器 stackoverflow.com/questions/574944/… 以角度操作纯 JavaScript，希望，它会有所帮助。
你试过 sanitizer.bypassSecurityTrustResourceUrl() 方法吗？我刚刚编辑了我的答案。
如果您仍然有 MIME 类型问题，请尝试从 html 模板中删除 rel="stylesheet"。