'Nuxt.js with vue-moment

I'm using vue-moment and it works perfectly, although i get an error in console

[Vue warn]: Failed to resolve filter: moment

What i'm doing:

plugins/moment.js

    import VueMoment from 'vue-moment'
    import Vue from 'vue'
    Vue.use(VueMoment)

nuxt.config.js

  plugins: [
    { src: '~/plugins/moment.js', mode: 'client' }
  ],

Vue-moment works just fine, but the error appears.

vue.js nuxt.js momentjs

Solution 1:^[1]

You should probably pass on using Moment since it deprecated itself: https://momentjs.com/docs/#/-project-status/

Rather using the module for date-fns, which is pretty simple to install and use: https://github.com/nuxt-community/date-fns-module

try using the Nuxt version. It is specifically made for Nuxt so you won't have any issues.

If anyone is still going through this, this was my approach.

In the plugins folder, I created a file named vue-moment.js and this is the content.

import Vue from 'vue'
Vue.use(require('vue-moment'));

After that, in the nuxt.config.js I added this line under plugins

plugins: [
...
"~/plugins/vue-moment",
...
],

Afterwards, when using it in the components, all I needed to do was call the function as shown below.

<span>{{ new Date() | moment("dddd, MMMM Do YYYY") }}</span>

I hope this helps someone.

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.