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

时间:2016-08-11 15:40:42

标签: angular webpack primeng

我开始使用ng2-admin而且我遇到了primeng问题。我正在使用数据表,并且primeng样式没有应用,我有一个简单的丑陋的无格式表。

我按照这里的说明操作: 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加载器我只是不知道在哪里以及如何添加它。

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

这是ng2-admin的网站 https://github.com/akveo/ng2-admin/tree/master/config 查看我正在考虑的文件可能是webpack.common.js的prod和dev?

我真的很感激你的帮助,谢谢你。

1 个答案:

答案 0 :(得分:2)

检查文件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';