angular - 将哈希添加到 css 文件名

Question

背景

• 我有两个css文件-styles.mobile.css和styles.desktop.css
• 顾名思义，我为移动和桌面视图使用了两个单独的 css
• 我根据屏幕大小在 index.html 中动态注入 css
• 显然我不能把它们放在styles.css
• 我附上了文件夹结构截图

问题 当我运行 ng build --prod 时，有没有办法向styles.mobile.css 和styles.desktop.css 添加散列

检测设备和注入 css 的代码

 private addCss(): void {
    if (this.currentDevice === "desktop") {
      this.document
        .getElementById("theme")
        .setAttribute("href", "styles.desktop.css");
    } else {
      this.document
        .getElementById("theme")
        .setAttribute("href", "styles.mobile.css");
    }
  }

标签： angularwebpackangular5angular-cliangular-cli-v6

Answer 1

添加“ng build --prod --output-hashing all”，对生成文件的内容进行hash，并将hash附加到文件名，以方便浏览器缓存破坏