npm install quickly-css --save

npm install quickly-css --save

import Vue from 'vue'

//sass
import 'quickly-css/lib/index.scss'

// or
import 'quickly-css/dist/quickly-css.min.css'

<link src="node_modules/quickly-css/dist/quickly-css.min.css">

<div class="w-full text-red">test</div>

<div class="test">test</div>
<style>
.test {
  width: 100%;
  color: #f35958;
}
</style>

<style>
  .wrapper {
    display: flex;
  }
  .left, .right {
    width: 200px;
    background: #f2f2f2
  }
  .center {
    flex: 1;
    background: #188eee
  }
</style>
<section class="wrapper">
  <div class="left">1</div>
  <div class="center">1</div>
  <div class="right">1</div>
</section>

<!-- use quickly-css -->
<style src="quickly-css/dist/quickly-css.css"></style>

<section class="flex j-between">
  <div class="w-200"></div>
  <div class="flex-1"></div>
  <div class="w-200"></div>
</section>

git clone https://gitee.com/zj1024/quickly-css.git

npm install

npm run build

.
├── Blog.md //更新日志
├── CONFIG.md // 项目的配置说明
├── DOC.md // 文档
├── LICENSE
├── README.md
├── dist // 打包输出的文件
│   ├── quickly-css.css
│   └── quickly-css.min.css
├── gulpfile.js
├── lib
│   ├── _reset.scss // 格式化css
│   ├── _style.scss // 全局样式
│   ├── _sundry.scss // 杂项样式
│   ├── _var.scss // 全局scss变量
│   ├── background.scss
│   ├── border.scss
│   ├── box.scss // margin padding
│   ├── cursor.scss // 鼠标样式相关
│   ├── display.scss
│   ├── flex.scss
│   ├── float.scss
│   ├── font-size.scss
│   ├── font-weight.scss
│   ├── index.scss
│   ├── line-height.scss
│   ├── link.scss
│   ├── overflow.scss
│   ├── position.scss
│   ├── size.scss // width height
│   ├── text-align.scss
│   ├── text-color.scss
│   ├── vertical-align.scss
│   ├── visibility.scss
│   └── white-space.scss
├── package-lock.json
└── package.json