Always Getting an Error of “Trailing Spaces not Allowed” in VueJS

问题

My project uses Vue and Vuetify and whenever I compile, this error always come out in my CLI: " Trailing spaces not allowed src\App.vue:39:11"

I am using ESlint but I already added the comment "/* eslint-disable eol-last */ " but the rules are still not being disabled.I am new to this framework.

here is my App.vue file:

<template>
  <div id="app">
    <div class="header">
      <h4>VUE.js SPA</h4>
     </div>
<v-card class="align-left">
  <v-navigation-drawer permanent>
    <v-list-item>
      <v-list-item-content>
        <v-list-item-title class="title">
          <router-link to="/" class="nav-link">Home</router-link>
        </v-list-item-title>
      </v-list-item-content>
      <v-list-item-content>
        <v-list-item-title class="title">
          <router-link to="/about" class="nav-link">About Me</router-link>
        </v-list-item-title>
      </v-list-item-content>
      <v-list-item-content>
        <v-list-item-title class="title">
          <router-link to="/works" class="nav-link">Works</router-link>
        </v-list-item-title>
      </v-list-item-content>
    </v-list-item>

    <v-divider></v-divider>

    <v-list dense nav>
      <v-list-item link>
        <v-list-item-content>
          <v-list-item-title>{{ item.title }}</v-list-item-title>
        </v-list-item-content>
      </v-list-item>
    </v-list>
  </v-navigation-drawer>
</v-card>
<div class="content">
  <router-view></router-view>
</div>  
 </div>
</template>

<script>
 export default {
  data () {
    return {
      items: [
        { title: 'Home' },
        { title: 'About' },
        { title: 'Works' }
      ]
    }
   }
  }
 </script>

回答1:

I think its a vscode issue. Try the following:

In vscode go to settings ( ctrl+, )
In settings search bar type "trim trailing whitespace"
Underneath check "trim trailing whitespace" option.
Restart vscode.
Now whenever you save a file, vscode will automatically trim trailing whitespaces.

Let me know if still the problem persists.

The above solution doesn't work, but still keeping the above solution for others.

Instead of using "/* eslint-disable eol-last /" use this "/ eslint-disable no-trailing-spaces */"

回答2:

I copy your code and see in line 39, you have some space after </div>. It is simple you should remove your space to ignore error.

来源：https://stackoverflow.com/questions/58794700/always-getting-an-error-of-trailing-spaces-not-allowed-in-vuejs

标签

Vue.js

vuetify.js

eslint