One of the things I love about the NuxtJS framework is that it does so much of the routine work for you - things like declaring components, for example - just create your components\user\account.vue file and magically you can access that anywhere in your project as <UserAccount />. But not all of the libraries that you could want to use are natively NuxtJS-ified but they ARE available as Vue libraries. So there's an easy way to use just about any Vue library in your NuxtJS project by declaring it as a plugin.
First we're going to add the Vue component to our project with npm - in this case, let's add the v-mask plugin for helping with form fields.
npm install v-mask
Next we create a simple little plugin file in the plugins folder
/plugins/vue-mask.js
import Vue from 'vue'
import VMask from 'v-mask'
Vue.use(VMask)
Declare the plugin in your nuxt.config.js - in this case, v-mask does not apply (or work!) on the server, so we declare it as a client only plugin
/nuxt.config.js
plugins: [
{ src: '~/plugins/vue-mask.js', mode: 'client' }
],
And finally, use the plugin - in this case for a phone number field in an address form.
<input
v-model="phone"
v-mask="'(###) ###-####'"
type="text"
>