在 VueJS 中总是出现“不允许尾随空格”的错误

Question

我的项目使用 Vue 和 Vuetify，每当我编译时，这个错误总是出现在我的 CLI 中：“ Trailing spaces not allowed src\App.vue:39:11”

我正在使用 ESlint，但我已经添加了注释“/* eslint-disable eol-last */ ”，但规则仍未被禁用。我是这个框架的新手。

这是我的 App.vue 文件：

 <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>

原文由 Alex Deneris 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

我认为这是一个 vscode 问题。尝试以下操作：

1. 在 vscode 中转到设置 ( ctrl+, )
2. 在设置搜索栏中输入“修剪尾随空格”
3. 在检查“修剪尾随空格”选项下方。
4. 重启vscode。
5. 现在，无论何时保存文件，vscode 都会自动修剪尾随空格。

让我知道问题是否仍然存在。

上面的解决方案不行，但还是保留上面的解决方案给其他人。

而不是使用“/\* eslint-disable eol-last /”使用这个“/ eslint-disable no-trailing-spaces */”

原文由 Mishel Tanvir Habib 发布，翻译遵循 CC BY-SA 4.0 许可协议