https://github.com/qiskit-community/qiskit-vue

Qiskit components library for Vue.
https://github.com/qiskit-community/qiskit-vue

qiskit quantum-computing vue

Last synced: about 1 month ago
JSON representation

Qiskit components library for Vue.

• Host: GitHub
• URL: https://github.com/qiskit-community/qiskit-vue
• Owner: qiskit-community
• Created: 2021-01-29T17:05:34.000Z (almost 4 years ago)
• Default Branch: main
• Last Pushed: 2021-11-22T13:58:11.000Z (about 3 years ago)
• Last Synced: 2024-10-30T20:53:12.796Z (about 2 months ago)
• Topics: qiskit, quantum-computing, vue
• Language: HTML
• Homepage: https://main--615d643ec68451003a336cee.chromatic.com/
• Size: 10.1 MB
• Stars: 5
• Watchers: 9
• Forks: 6
• Open Issues: 8
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • Code of conduct: CODE_OF_CONDUCT.md

Awesome Lists containing this project

README

        
# Qiskit Vue

![npm](https://img.shields.io/npm/v/@qiskit-community/qiskit-vue) ![npm](https://img.shields.io/npm/dw/@qiskit-community/qiskit-vue)

Qiskit component library for Vue 2 and Vue 3.

https://qiskit-community.github.io/qiskit-vue/

## Installation

Install the required dependencies:

```

npm install @qiskit-community/qiskit-vue vue-demi

```

If your project uses Vue 2, also install the Composition API package:

```

npm install @vue/composition-api

```

## Usage in Vue 2 project

Example:

```

  

import Vue from 'vue'

import { Component } from 'vue-property-decorator'

import QLogo from '@qiskit-community/qiskit-vue/src/components/QLogo/index.vue'

@Component({

  components: { QLogo }

})

export default class MyComponent extends Vue {}

```

## Usage in Vue 3 project

Example:

```

  

import { Options, Vue } from 'vue-class-component'

import QLogo from '@qiskit-community/qiskit-vue'

@Options({

  components: { QLogo }

})

export default class MyComponent extends Vue {}

```

## Development

### Project setup

```

npm install

```

#### Run Storybook

```

npm run dev

```

#### Run your unit tests

```

npm run test:unit

```

#### Lints and fixes files

```

npm run lint

```

### Conventions

We use [Angular Commit Message Conventions](https://github.com/angular/angular/blob/master/CONTRIBUTING.md#-commit-message-format) as our convention for commit messages.

## Versioning

We use [Semantic Release](https://github.com/semantic-release/semantic-release) for releasing new package versions and updating our CHANGELOG.