如何在 JavaScript 文件中允许空格？答案

【问题标题】：How can I allow whitespace in JavaScript files?如何在 JavaScript 文件中允许空格？
【发布时间】：2020-04-21 07:35:27
【问题描述】：

我试图覆盖 Prettier 插件规则但没有成功。我想在这样的 JavaScript 文件中允许空格：

import React, { Component }  from 'react';
import { View }              from 'react-native';
import { Provider, connect } from 'react-redux';

我需要处理的 .eslint 文件：

{
  "plugins": ["prettier"],
  "rules": {
    "prettier/prettier": [
      "error",
      {
        "singleQuote": true,
        "trailingComma": "all",
        "bracketSpacing": true,
        "tabWidth": 2,
        "printWidth": 130
      }
    ]
  },
  "env": {
    "browser": true,
    "es6": true
  },
  "parser": "babel-eslint",
  "parserOptions": {
    "ecmaVersion": 6,
    "sourceType": "module",
    "ecmaFeatures": {
      "jsx": true
    }
  },
  "extends": ["prettier"]
}

我已经尝试过 eslint 键间距规则，但 lint 来自更漂亮的插件。我在Prettier documentation 中找不到空格字符的规则。

【问题讨论】：

标签： javascript eslint prettier eslintrc jsprettier

【解决方案1】：

您不会在他们的文档中找到空格规则，因为没有禁用它们的选项。我也查了他们的论坛。你可以做的是忽略 .eslint 文件，因为 prettier 和 prettier 不会格式化这些扩展文件。

作为临时解决方案，只需将 **/*.eslint 添加到您的 .prettierignore 文件中即可。

【讨论】：

您可以链接到任何相关论坛讨论以供参考。
github.com/prettier/prettier/issues/5380 给你。虽然这适用于 html，但同样适用于 eslint 或几乎任何扩展。干杯。

【解决方案2】：

我可能有你要找的东西。我用 ESLint 和 Prettier 搞砸了很多。如果你已经拥有这两者，你可以卸载/禁用 Prettier，然后安装这个扩展：

Prettier ESLint by Rebecca Vest

顾名思义，您可以将它与 ESLint 扩展集成。 AFAIK 它运行良好，我将它用于 React Native 项目。 3天前已经更新了，所以是一个非常活跃的项目。

默认情况下，原始 Prettier 使用“括号间距”选项执行此操作。但我建议您使用我建议的第一个，因为使用您自己的规则更容易自定义。

干杯

【讨论】：