angular - 清晰设计系统 CSS 不起作用

Question

我在这篇文章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的新手

Answer 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'
}

有用！！