CODEWITHSUNDEEP
vue.jsvuetify.jseslint
Alex Deneris
Alex Deneris

Reputation: 173

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>

Upvotes: 7

Views: 47659

Answers (3)

Omar Rangel
Omar Rangel

Reputation: 61

You should run npm run lint -- --fix, to continue.

Upvotes: 6

Mishel Tanvir Habib
Mishel Tanvir Habib

Reputation: 1142

I think its a vscode issue. Try the following:

  1. In vscode go to settings ( ctrl+, )
  2. In settings search bar type "trim trailing whitespace"
  3. Underneath check "trim trailing whitespace" option.
  4. Restart vscode.
  5. 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 */"

Upvotes: 23

B&#236;nh Trương
B&#236;nh Trương

Reputation: 400

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.

Upvotes: 3

Related Questions