crip-vue-notice
A Vue.js project to add global notices on a page. Take a look to demo page
Usage
Install
> npm i -S crip-vue-noticePrerequisites
- Font Awesome: Add font awesome css to make ikons in notices visible:
... Setup
// Install component in to Vue instance.VueDisplay notification
// App.vue<template> <div class="container"> <div class="row"> <div class="col-lg-6 col-lg-offset-3 col-md-8 col-md-offset-2"> <button class="btn btn-default" @click="notice('open')">Normal</button> <button class="btn btn-default" @click="notice('error')">Error</button> <button class="btn btn-default" @click="notice('info')">Info</button> <button class="btn btn-default" @click="notice('success')">Success</button> <button class="btn btn-default" @click="notice('warning')">Warning</button> </div> </div> </div></template> <script>export default { methods: { notice (type) { this.$notice[type]({ title: `Notice of ${type} type`, description: `Notice of ${type} type was clicked and it popped up!` }) }, },}</script>Build Setup
# install dependencies and serve with hot reload at localhost:8080 > npm i && npm run devRelease steps
> npm run release