Angular2,webpack 全局添加外部 css 到 ng2-admin

Angular2, webpack add external css globally to ng2-admin

我开始使用 ng2-admin,但在使用 primeng 时遇到了问题。我正在使用数据 table 并且 primeng 样式不适用,我有一个普通丑陋的未格式化 table.

我正在按照此处的说明进行操作: http://www.primefaces.org/primeng/#/setup

我在不同的项目中添加了这些行:

<link rel="stylesheet" type="text/css" href="node_modules/primeui/themes/omega/theme.css" />
<link rel="stylesheet" type="text/css" href="YOUR_PATH/font-awesome.min.css" />
<link rel="stylesheet" type="text/css" href="node_modules/primeui/primeui-ng-all.min.css" />

以前用过,但是这个ng2-admin项目用的是webpack,我不是很熟悉。我读到了它,它说要在 webpack.config.js 中使用 css 加载程序,我只是不知道在哪里以及如何添加它。

如果我将 link 直接添加到 index.html,文件将根据下面的 link 在文件上获得 404。 https://github.com/akveo/ng2-admin/issues/25

这是 ng2-admin 的网站 https://github.com/akveo/ng2-admin/tree/master/config 查看这些文件,我想可能 webpack.common.js 用于生产和开发?

非常感谢您的帮助,谢谢。

检查文件 config/webpack.common.js 我意识到 node_module 文件夹可以在整个应用程序中使用,我只需要创建一个文件 somename.loader.ts添加两行:

require('style-loader!primeui/themes/omega/theme.css');
require('style-loader!primeui/primeui-ng-all.min.css');

然后像这样将该加载器包含到我的组件中:

import './somename.loader.ts';