预期 'styleUrls' 是一个没有 webpack 的字符串数组

【问题标题】：Expected 'styleUrls' to be an array of strings without webpack预期 'styleUrls' 是一个没有 webpack 的字符串数组
【发布时间】：2022-01-22 12:22:49
【问题描述】：

我有这个组件

@Component({
    selector: 'app-modal-step',
    templateUrl: './modal-step.component.html',
    styleUrls: ['./modal-step.component.scss', LoadAssets.getDefaultStyles()]
})

我使用LoadAssets 在stylesUrls 中推送一个新的scss

export class LoadAssets {
    constructor() {
    }

    public static getDefaultStyles(): string {
        let _env = window.sessionStorage.getItem('environment');
        return `./assets/styles/images-${_env}.scss`;
    }
}

当我尝试构建应用程序时，显示此错误：

我的应用程序没有使用webpack，我尝试了几种方法，但是当我在 styleUrls 中放置多个文件时它无法识别

【问题讨论】：

标签： angular sass

【解决方案1】：

有些地方你不清楚。

你的应用程序使用 webpack，那是因为 angular 编译器（现在是 Ivy）使用 webpack 进行编译。正是在编译时，Angular 会预处理你的 css/scss 以使一些神奇的封装成为可能：

你得到的错误很清楚。它需要一个字符串数组：您传递一个字符串数组和一个函数。不可能使用函数，因为预处理的东西是在预处理时完成的。

根据环境使用不同的样式是 stackoverflow 中已经提出的问题，具体取决于您的要求。有一些提示：

【讨论】：