wostex

<div id="app">
  <p>{{ helloText }}</p>
</div>

const mylib = {
    hello : (text1, text2) => { 
    	return `Hello! ${text1} ${text2}`
    },
    install: function(Vue){
      Object.defineProperty(Vue.prototype, 'mylib', {
        get () { return mylib }
      })
    }
};

Vue.use(mylib);

new Vue({
    el: '#app',
    data: {
    	helloText: mylib.hello('one', 'two')
    }
});

myMutation: (state, payload) => {...} // для mutations

myAction: (context, payload) => {...} // для actions

<div v-for="slide in slidesToShow" class="projects__item">
  <div class="projects-info">
    <div class="projects-info__title">{{ slide.title }}</div>
    <div class="projects-info__description">{{ slide.text }}</div>
  </div>
  <div class="projects__play"></div>
  <video class="projects__item-video" preloader="none" loop muted>
    <source :src="slide.video" type="video/mp4">
  </video>
</div>
<button @click="showMore()">More</button>


export default {
    async asyncData () {
      const { data } = await axios.get('https://ggproduction-f0b98.firebaseio.com/slides.json')
      return { slides: data }
    },
    data: function () {
        return {
            nShow: 8, // изначально
            nAdd: 2 // сколько добавляем
        }
    },
    computed: {
        slidesToShow: function() {
            return this.slides.slice(0, this.nShow);
        }
    },
    methods: {
        showMore: function() {
            this.nShow += this.nAdd;
        }
    }
  }

data: function() {
   return {
      notAsyncData: 'hello'
      ....
   }
}

import Button from './Button.vue'

components: {
   'app-button': Button
}

const router = new VueRouter({
  routes: [{path:'/', component: ...}]
});

var article_form = new Vue({
  el: '#article_form',
  router,
...