@nextcloud/vue

Vue components

This repo contains the various Vue.js components that Nextcloud uses for its internal design and structure. It provides standardized UI elements for building Nextcloud app frontends with Vue.js.

Documentation

A list of available components with examples to try out is available in the documentation.

Getting started

App example

If you want to check a real live example of a nextcloud app that uses this library, you can head over to https://github.com/skjnldsv/vueexample/ We will try to maintain this repository the best we can, but some example might be obsolete. Always check this repository documentation.

Install the library

npm i --save @nextcloud/vue

Usage

To use a component, just import it:

import { AppNavigation } from '@nextcloud/vue'

Depending on which components you use, you might want to only import individual (separately bundled) components:

import Avatar from '@nextcloud/vue/dist/Components/Avatar'

Development setup

If you want to work on improving the components it’s best to run the latest code and link it to your local Nextcloud installation:

1. Install the dependencies with npm i
2. Build the components every time you do changes: npm run build
3. Connect it to your local Nextcloud development setup:
   • In this repository do npm link
   • In the repository of an app do npm link @nextcloud/vue

The link is going to be broken every time you do npm i in the app you linked it to, so then you will have to re-link.