angular - 网页包/Angular 2 : specify order of styles

Question

我是Webpack的新手，所以请原谅我的无知。

我将 Webpack 与 Angular 2 和 bootstrap/jquery/font-awesome 结合使用。

在我的 Vendor.ts 文件中，我有以下代码；

// .... omitted

// Misc
import 'jquery';
import 'bootstrap-loader';
import 'font-awesome-webpack';

我有一个包含全局样式的自定义 SCSS 文件(范围限于页面而非组件)，我正在将其导入 Main.ts；

import "./site.scss";

问题是 site.scss(被 Webpack 重命名为 app.css)被放置在 header BEFORE bootstrap 等。

我需要在引导 CSS 之后加载 app.css。

有什么建议可以实现吗？

Answer 1

有一个偷懒的方案:Scss支持导入另一个css或者scss文件导入一个。

因此，在您的情况下，您可以将 bootstrap 导入 site.scss 文件并仅使用 site.scss(将 import 语句写到开头，以便下面的代码将被覆盖)。

更多: Import regular CSS file in SCSS file?