Как получить содержимое файла CSS компонента в Angular 7?

Question

Я хотел бы получить содержимое файла CSS компонента.

Например:

hello-world.component.ts:

@Component({
    selector: 'app-hello-world',
    template: `<h1>Hello World</h1>`,
    styleUrls: ['./hello-world.component.css']
})

export class HelloWorldComponent {
    getCSSContent(){
    }
}

привет-world.component.css:

h1 {
    color: red;
    font-weight: 400;
}

Я ожидаю, что функция getCSSContent вернет:

h1 {
    color: red;
    font-weight: 400;
}

Answer 1

В папке 'src' добавьте новый файл со следующим именем:

typings.d.ts

со следующим содержанием:

declare module '*.css';

В вашем компоненте добавьте:

import helloWorldCss from './hello-world.component.css'

и вы можете прочитать свой CSS с

getCSSContent(){
    return helloWorldCss;
}

Я узнал какой-то странный текст в конце переменной helloWorldCss ... возможно, вам придется его обрезать.