Vue.js and vue-moment: "Failed to resolve filter: moment"
vue-moment
is broken.
You can't use it by just adding it as a <script>
tag. Currently it only works if you use compile it with webpack or browserify, see this issue for updates.
It used to work well on the original version:https://github.com/brockpetrie/vue-moment/tree/fd6fcb901415c1df4c5abb81870d49b346d3732f
See the original version working here: https://jsfiddle.net/gerardog/vaw33sn2/
Also, on Fiddle dont link to files in https://raw.github.com/ , use this niceworkaround
/////EDIT/////
apparently you don't need to put moment inside a Vue.filter(....)
at all.
after you entered Vue.use(VueMoment)
in main.js
,simply put a filter as shown in their documentation anywhere in your app and it just works
//////////////
I encountered the same problem, solved it by not using vue filters
this is my workaround, my main.js looks like this:
import Vue from 'vue'import VueMoment from 'vue-moment';Vue.use(VueMoment)
and in the component wherever i need to use moment it looks like this:
//IN METHODS:methods: { tellTime(time) { console.log(this.$moment(time).format(' mm:ss')) }}
<!-- OR IN TEMPLATE --> {{$moment(timestamp).fromNow()}}
Hope someone else would find it useful :)
I wouldn't suggest doing it the way you are, you should create the date variable in the javascript code and just access the variable in your Vue. Here is a fiddle showing what I mean
https://jsfiddle.net/rdffywc7/
var app = new Vue({ el: document.body, data: { date: moment().format("dddd, MMMM Do YYYY") }})
and then in the doc body
<span>{{ date }}</span>