shards vue

Shards Vue是一个免费，美丽而现代的VUE.JS UI套件
基于碎片。

文档和演示•官方页面

入门

开始使用Shards Vue非常简单。您可以通过官方网站，在GitHub上作为发布包或使用YARN或NPM等软件包管理器下载Shards Vue。

• 官方网站
• 发布包

快速开始

您可以通过纱线或NPM安装碎片VUE。

// Install via Yarn
yarn add shards-vue

// Install via NPM
npm i shards-vue

模块捆绑器

如果您使用的是模块捆绑包，例如WebPack或lollup，则可以在项目中包含整个碎片vue库。

 import Vue from 'vue'
import ShardsVue from 'shards-vue'

// Import base styles (Bootstrap and Shards)
import 'bootstrap/dist/css/bootstrap.css'
import 'shards-ui/dist/css/shards.css'

Vue . use ( ShardsVue ) ;

将组件注册为VUE插件

如果您只想将某些组件注册为VUE插件，请确保仅导入要使用的组件。

 import Vue from 'vue'

// Import base styles (Bootstrap and Shards)
import 'bootstrap/dist/css/bootstrap.css'
import 'shards-ui/dist/css/shards.css'

import { Button } from 'shards-vue/src/components'
Vue . use ( Button )

导入单个文件组件

导入单文件组件也是可能的。

< template >
    < d-button @click = " handleClick " >Click Me!</ d-button >
</ template >

< script >
import dButton from ' shards-vue/src/components/button/Button '

export default {
    components : {
        dButton
    },
    methods : {
        handleClick () {
            alert ( ' You just clicked me! ' )
        }
    }
}
</ script >

文件大小

您还可以随时运行yarn bundlesize以检查编译的文件尺寸。

文件名	尺寸（Min.gz）
shards-vue.common.min.js	46.29kb
shards-vue.esm.min.js	46.24KB
shards-vue.umd.min.js	39.3kb

使用

• 碎片UI套件
• LéonGersen的Nouislider（WTFPL许可证）
• vuejs-datepicker

贡献

请阅读有关我们的行为准则的详细信息以及向我们提交拉的请求的过程的详细信息。

如果您想修复错误或处理功能，请确保按照以下步骤操作以设置本地计算机上的开发环境：

1. 克隆存储库。
2. 运行yarn以安装所有必需的依赖项。
3. 通过运行： npm i -g @vue/cli @vue/cli-service-global或yarn global add @vue/cli-service-global 。
4. 运行yarn watch以启动服务器并使用热重加载运行沙箱。
5. 有关更多详细信息，请参阅sandbox/Sandbox.vue文件。

路线图

查看路线图。

ChangElog

查看显着的更改。