Errors and warnings on a simple Vue.js powered page

Hello,

I just started a course on Udemy about Vue.js, that is new to me: just from the start, in a simple page like the following, I get lot of errors and warnings (of course I installed and activated the official Vue plugin):

<div id="app">
<input type="text" v-on:input="changeTitle">
<p>{{ title }}</p>
</div>

<script>
new Vue({
el: '#app',
data: {
title: 'Hello world!'
},
methods: {
changeTitle: function(event){
this.title = event.target.value;
}
}
});
</script>
  1. on v-on: "Namespace 'v-on' is not bound"
  2. on changeTitle into methods: "Unused property changeTitle"

What's wrong with this simple snippet? If warning and errors come on this very simple snippet, I don't wanaìna think what will happen in most complex scripts...

Please any help?

2 comments
Comment actions Permalink

What is your IDE version?

I can't reproduce it in the last versions.

0
Comment actions Permalink

Vue.js plugin only supports single-file components with a .vue extension (https://vuejs.org/v2/guide/single-file-components.html). Components in .html files are not supported, sorry... And it is unlikely that they will be supported in future

 

v-on issue is tracked as https://youtrack.jetbrains.com/issue/WEB-28895

1

Please sign in to leave a comment.