样式不是从angular.json样式数组angular 6中挑选的,但是可以与styles.css中的导入正常工作

时间:2018-08-24 06:14:29

标签: css angular6 primeng

我在angular.json样式数组中包含了一些样式,如下所示:

 "styles": [
              "src/styles.css",
              "node_modules/primeicons/primeicons.css",
              "node_modules/primeng/resources/themes/omega/theme.css",
              "node_modules/primeng/resources/themes/bootstrap/theme.css",
              "node_modules/primeng/resources/primeng.min.css",
              "node_modules/bootstrap/dist/css/bootstrap.min.css",
              "node_modules/font-awesome/css/font-awesome.css"
            ]

但是它不是精选样式,因为我看不到primeng表样式和其他样式。 尽管如果我在styles.css文件中导入样式,效果很好,如下所示:

@import '../node_modules/primeng/resources/themes/omega/theme.css';
 @import '../node_modules/primeng/resources/themes/bootstrap/theme.css';
 @import '../node_modules/primeicons/primeicons.css'

我相信我们可以使用上述任何一种方法,如果不正确,请告诉我。

我也重新启动了ng服务多次。

感谢您的帮助。谢谢你。

我在angular.json中使用了angular 6,这很明显,还让我知道是否需要共享任何其他代码或信息。

2 个答案:

答案 0 :(得分:1)

您也可以按原样保留.angular.cli.json

 "styles": [
        "../node_modules/bootstrap/dist/css/bootstrap.css",
        "../node_modules/font-awesome/css/font-awesome.min.css",
        "../node_modules/primeng/resources/primeng.min.css",
        "../node_modules/primeng/resources/themes/omega/theme.css",
        "styles.scss"
      ],

样式的顺序很重要。在上面的例子中。 Bootstrap css将首先应用,然后是primeng主题,最后是您的自定义scss文件。最终,styles.scss将覆盖所有其他样式。无需在任何地方导入。

答案 1 :(得分:0)

在styles数组中添加css后 停止 angular 项目的本地服务器并重新启动它,简单来说 重启当前 angular 项目的本地服务器