为什么要将 CSS 文件导入打字稿？答案

【问题标题】：Why would a CSS file be imported into typescript?为什么要将 CSS 文件导入打字稿？
【发布时间】：2019-09-25 23:31:39
【问题描述】：

在使用 Angular 4 和自定义 Webpack 的较旧、复杂的代码库中，有一些组件会导入 css 文件，就像导入模块以产生副作用一样。一个例子（这是完整的文件，有不同的变量名）：

import { Component, OnInit } from '@angular/core';
import '../../assets/css/styles.css';

@Component({
    selector: 'sidebar-app',
    templateUrl: './sidebar.component.html',
    styleUrls: ['./sidebar.component.css']
})
export class SidebarComponent implements OnInit {

    ngOnInit() {
    }
}

styles.css

.content_body {
    padding: 0;
}

.basic_page_wrapper {
    padding: 0;
}

我从未见过在 typescript 中导入 css，并且我发现的所有其他示例都以某种方式使用了这些样式，例如

import * as s from './Button.css';

为什么像 import '../../assets/css/styles.css'; 这样的 css 文件会被导入到 Angular 组件中？

【问题讨论】：

标签： css angular typescript ecmascript-6

【解决方案1】：

在使用 webpack 或 browserify 等捆绑程序时，可能会导入一个 CSS 文件以便对其进行处理并将其打包到与导入它的 JavaScript 模块相同的捆绑包中。

在 webpack 中，这是使用 style-loader 完成的。阅读更多this medium post！

【讨论】：