清晰设计系统 CSS 不起作用答案

【问题标题】：Clarity Design System CSS don't work清晰设计系统 CSS 不起作用
【发布时间】：2018-01-03 18:10:03
【问题描述】：

我在这篇帖子 Clarity Design System-Get Started 上做了所有事情，但我无法让它发挥作用。我在一个新的 ionic proyect 上安装了 Clarity UI，但是当我尝试添加一个简单的 Card 示例或其他任何内容时：

  <div class="row">
<div class="col-lg-5 col-md-8 col-sm-12 col-xs-12">
    <div class="card">
        <div class="card-header">
            Header
        </div>
        <div class="card-block">
            <div class="card-title">
                Block
            </div>
            <div class="card-text">
                ...
            </div>
        </div>
        <div class="card-footer">
            <button class="btn btn-sm btn-link">Footer Action 1</button>
            <button class="btn btn-sm btn-link">Footer Action 2</button>
        </div>
    </div>
</div>

CSS 没有工作。这就是它的样子2

我错过了什么？ CSS 和 JS 文件无法被这样的东西引用：

<link rel="stylesheet" href="path/to/node_modules/clarity-ui/clarity-ui.min.css">

我是 Ionic2 + Angular 的新手，我是 Clarity 的新手

【问题讨论】：

欢迎您！请阅读how-to-ask 文章以帮助我们帮助您。我们需要了解您具体做了什么以及错误是什么。
你说得对，菲利普，对不起。我添加了一些附加信息。我只是按照本教程进行操作，我发现的任何其他信息都只是相同的信息。
我没有使用clearance，但是过程大概和使用font-awesome差不多。看看this，看看它是否可以为这个清晰的东西的css部分增加。
再次感谢菲利普！！我终于找到了这个

标签： angular ionic2 vmware-clarity

【解决方案1】：

再次感谢菲利普！我读了这篇文章，终于找到了这个文件 {{ROOT}}\node_modules\@ionic\app-scripts\config\copy.config.js 我在其中添加了这个：

copyClarityIcons: {
    src: ['{{ROOT}}/node_modules/clarity-icons/clarity-icons.min.css'],
    dest: '{{WWW}}/assets/css'
},
copyClarityElements: {
    src: ['{{ROOT}}/node_modules/@webcomponents/custom-elements/custom-elements.min.js','{{ROOT}}/node_modules/clarity-icons/clarity-icons.min.js'],
    dest: '{{WWW}}/assets/js'
},
copyClarityCSS: {
    src: ['{{ROOT}}/node_modules/clarity-ui/clarity-ui.min.css'],
    dest: '{{WWW}}/assets/css'
}

有效！！

【讨论】：