shards vue

Shards Vue est un kit Vue.js gratuit, beau et moderne
basé sur des fragments.

Documentation et démo • Page officielle

Commencer

Commencer avec des Shards Vue est assez simple. Vous pouvez télécharger Shards Vue via le site officiel, ici sur GitHub en tant que package de version ou en utilisant un gestionnaire de packages tel que le fil ou le NPM.

• Site officiel
• Package de publication

Démarrage rapide

Vous pouvez installer des fragments Vue via le fil ou le NPM.

// Install via Yarn
yarn add shards-vue

// Install via NPM
npm i shards-vue

Gras de module

Si vous utilisez un bundler de module tel que WebPack ou Rollup, vous pouvez inclure l'intégralité de la bibliothèque Shards Vue à l'intérieur de votre projet.

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

Enregistrement des composants en tant que plugins VUE

Si vous souhaitez enregistrer uniquement certains composants en tant que plugins VUE, assurez-vous d'importer uniquement le composant que vous souhaitez utiliser.

 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 )

Importation de composants de fichiers uniques

L'importation de composants de fichiers uniques est également possible.

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

Tailles de fichiers

Vous pouvez également exécuter yarn bundlesize à tout moment pour vérifier les tailles de fichiers compilées.

Nom de fichier	Taille (min.gz)
shards-vue.common.min.js	46.29KB
Shards-vue.esm.min.js	46.24KB
shards-vue.umd.min.js	39,3 Ko

Construit à l'aide

• Kit d'interface utilisateur de fragments
• Nouislider par Léon Gersen (licence WTFPL)
• Vuejs-Datepicker

Contributif

Veuillez lire contribution.md pour plus de détails sur notre code de conduite et le processus de soumission des demandes de traction à nous.

Si vous souhaitez corriger un bogue ou travailler sur une fonctionnalité, assurez-vous de suivre les étapes ci-dessous afin de configurer l'environnement de développement sur votre machine locale:

1. Clone le référentiel.
2. Exécutez yarn pour installer toutes les dépendances requises.
3. Installez VUE CLI et le service CLI globalement en fonctionnant: npm i -g @vue/cli @vue/cli-service-global ou yarn global add @vue/cli-service-global .
4. Exécutez yarn watch afin de lancer le serveur et d'exécuter le bac à sable avec un rechargement chaud.
5. Reportez-vous au fichier sandbox/Sandbox.vue pour plus de détails.

Feuille de route

Voir la feuille de route.

Changelog

Afficher les modifications notables.