Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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>
like image 630
Alex Deneris Avatar asked Nov 30 '22 08:11

Alex Deneris


2 Answers

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

like image 34
Omar Rangel Avatar answered Dec 04 '22 06:12

Omar Rangel


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 */"

like image 165
Mishel Tanvir Habib Avatar answered Dec 04 '22 07:12

Mishel Tanvir Habib