https://github.com/garfileds/vue-night-switch

A vue element/plugin for turning on/off light
https://github.com/garfileds/vue-night-switch

vue-night vue2

Last synced: 5 days ago
JSON representation

A vue element/plugin for turning on/off light

• Host: GitHub
• URL: https://github.com/garfileds/vue-night-switch
• Owner: garfileds
• License: mit
• Created: 2017-03-01T09:38:38.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2018-03-09T08:57:59.000Z (over 6 years ago)
• Last Synced: 2024-04-25T01:08:13.623Z (5 months ago)
• Topics: vue-night, vue2
• Language: JavaScript
• Size: 302 KB
• Stars: 2
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.MD
  • License: LICENSE

Awesome Lists containing this project

README

        
# vue-night-switch [![Build Status](https://travis-ci.org/garfileds/vue-night-switch.svg?branch=master)](https://travis-ci.org/garfileds/vue-night-switch) [![npm package](https://img.shields.io/npm/v/vue-night-switch.svg)](https://www.npmjs.com/package/vue-night-switch)

vue-night-switch has the power to switch night/daytime. You can use it

as vue-directive or vue-component.

# Demo

Scan the qr-code using your phone

![image](https://raw.githubusercontent.com/garfileds/vue-night-switch/master/examples/images/demo-qr.png)

Or visit `http://adoug.info/demo/vueNightSwitch` in your phone

# Install

```bash

 npm install vue-night-switch --save

```

# Usage: as an directive

You can add `v-night` to any HTML Element

```html

```

### CommonJs

You can use any build tool supports `CommonJs`

```JavaScript

// register globally

var nightDirective = require('vue-night-switch').NightDirective

Vue.use(nightDirective)

// or for an single instance

var nightDirective = require('vue-night-switch').NightDirective

new Vue({

  directives: {nightDirective}

})

```

### ES6

ES6 module is also supported with build tools support babel

```JavaScript

import {NightDirective} from 'vue-night-switch'

```

# Usage: as an vue component

Just add tag ``. It has default style.

```html

  

```

### CommonJs

```javascript

var NightSwitch = require('vue-night-switch')

Vue.use(NightSwitch)

```

### ES6

```javascript

import NightSwitch from 'vue-night-switch'

Vue.use(NightSwitch)

```

# Usage: Directly use

Include vue-night-switch.js in your JavaScript bundle or add it to your HTML page like this:

```html

```

The file places in `dist/vue-night-switch.js`

# Other

`npm run build`: get bundle in `/dist` built by webpack

`npm run test`: get unit test result supported by karma

By the way, if you has interest, the project is developed by `fis3`

you can build and cat `examples/demo1.html` by:

```bash

fis3 release -d ./dev

```

```bash

fis3 server start --www ./dev

```