Where to store common component methods in #NUXT.JS

I go for mixins like with plain vue.js. Only difference - for global mixins - I include them as a plugin, but first:

Non global mixins

I would create an extra folder for my mixins. For example in a /mixins/testMixin.js

export default {  methods: {    aCommonMethod () {}  }}

Then import in a layout, page or component and add it via the mixins object:

<script>  import commonMixin from '~/mixins/testMixin.js  export default {    mixins: [commonMixin]  }</script>

Global mixins

For example in a new file plugins/mixinCommonMethods.js:

import Vue from 'vue'Vue.mixin({  methods: {    aCommonMethod () {}  }})

Include that file then in nuxt.config.js

plugins: ['~/plugins/mixinCommonMethods']

After that you would have the method everywhere available and call it there with this.commonMethod(). But here an advice from the vue.js docs:

Use global mixins sparsely and carefully, because it affects every single Vue instance created, including third party components. In most cases, you should only use it for custom option handling like demonstrated in the example above. It’s also a good idea to ship them as Plugins to avoid duplicate application.

Inject in $root & context

Another possibility would be to Inject in $root & context