shards vue

Shards Vue ist ein kostenloses, schönes und modernes Vue.js UI -Kit
basierend auf Scherben.

Dokumentation & Demo • Offizielle Seite

Erste Schritte

Der Einstieg mit Shards Vue ist ziemlich einfach. Sie können Shards Vue über die offizielle Website, hier auf GitHub als Release -Paket oder mit einem Paketmanager wie Garn oder NPM herunterladen.

• Offizielle Website
• Release -Paket

Schneller Start

Sie können Scherben vue über Garn oder NPM installieren.

// Install via Yarn
yarn add shards-vue

// Install via NPM
npm i shards-vue

Modulbundler

Wenn Sie einen Modul -Bundler wie WebPack oder Rollup verwenden, können Sie die gesamte Shards Vue -Bibliothek in Ihr Projekt einbeziehen.

 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 ) ;

Registrieren von Komponenten als VUE -Plugins

Wenn Sie nur bestimmte Komponenten als VUE -Plugins registrieren möchten, importieren Sie nur die Komponente, die Sie verwenden möchten.

 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 )

Importieren von Einzeldateikomponenten

Das Importieren von Einzeldateikomponenten ist ebenfalls möglich.

< 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 >

Dateigrößen

Sie können auch jederzeit yarn bundlesize ausführen, um die kompilierten Dateigrößen zu überprüfen.

Dateiname	Größe (min.gz)
shards-vue.common.min.js	46,29 kb
Shards-vue.esm.min.js	46,24KB
Shards-vue.umd.min.js	39,3KB

Gebaut mit

• Shards UI Kit
• Nouislider von Léon Gersen (WTFPL -Lizenz)
• Vuejs-Datepicker

Beitragen

Bitte lesen Sie mit Beitrags.md für Informationen zu unserem Verhaltenskodex und dem Vorgang zum Senden von Pull -Anfragen an uns.

Wenn Sie einen Fehler beheben oder an einer Funktion arbeiten möchten, befolgen Sie die folgenden Schritte, um die Entwicklungsumgebung auf Ihrer lokalen Maschine einzurichten:

1. Klonen Sie das Repository.
2. Führen Sie yarn aus, um alle erforderlichen Abhängigkeiten zu installieren.
3. Installieren Sie Vue CLI und den CLI-Dienst global, indem Sie ausführen: npm i -g @vue/cli @vue/cli-service-global oder yarn global add @vue/cli-service-global .
4. Führen Sie yarn watch aus, um den Server zu starten und die Sandbox mit heißem Nachladen auszuführen.
5. Weitere Informationen finden Sie in der Datei sandbox/Sandbox.vue -Datei.

Roadmap

Sehen Sie sich die Roadmap an.

Changelog

Bemerkenswerte Änderungen anzeigen.