首页 文章

如何让VueJS ESLint（Airbnb）Prettier一起工作？ （VSCode）

提问于
浏览 次
3

在过去的几天里，我一直在试着让它发挥作用并且没有运气，所以我希望这里的人可以提供一些帮助！

基本上，我正在使用VueJS，我非常喜欢Airbnb使用的ESLint规则，但我也想使用更漂亮的 ONLY 格式 . （最大长度，缩进等...）因此，例如，而不是它;

<li v-for="(item, index) in this.list" v-bind:key="index" v-if="showRandomFor">{{item}}</li>

就是这样; （或沿着这些方向的东西）
should look like this

但是，我永远无法做到这一点 . 我已经尝试过使用 eslint-config-prettier ，它一直没有任何帮助，因为即使将它包含在eslint配置中，仍然可以应用更漂亮的规则（没有错误消息），所以我不确定如何处理这个问题 .

非常感谢任何帮助，如果我能提供任何其他信息或日志，请告诉我！

编辑：只是为了澄清，我看了其他帖子 . 但我似乎找不到涉及VueJS的人 . Vue引起很多其他问题，因为eslint /更漂亮，所以请不要说我的问题是与其他人请求帮助的副本 .

vue.js visual-studio-code eslint prettier

1 回答

  • 2

    这个问题让我对我的生活选择提出质疑，因为我发誓早些时候这样做了也许最新的vs代码更新改变了一些事情？

    无论如何，在我们等待更好的东西的时候，对于vs-code来说，这是一个不那么漂亮的答案：

    vs-code设置，：

    {
  "vetur.validation.template": false,
  "prettier.eslintIntegration": true,
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    {
      "language": "vue",
      "autoFix": true
    }
  ],
  "eslint.run": "onType",
  "eslint.autoFixOnSave": true
}

    虽然 autoFixOnSave 有效，但我无法得到 editor.action.formatDocument 无论如何都要听我的esconfig（这一定已经改变了，对吧？对吗??）那该怎么办？

    我将formatDocument-key反弹为使用 eslint.executeAutofix . 它只进行一次传递（即使错误仍然存在），所以你有垃圾邮件密钥 - 这对于html属性来说特别明显，但我猜是这样的 .

    这是我的.eslintrc.js：

    module.exports = {
  root: true,
  extends: [
    "plugin:vue/recommended",
    'airbnb'
  ],
  parserOptions: {
    parser: "babel-eslint", // I guess we have prettier using eslint using babel-eslint? :(
    sourceType: "module"
  },
};

    当你找到更好的东西时别忘了更新！

    回复于

相关问题