VS代码中的ReactJS格式[重复]答案

【问题标题】：ReactJS formatting in VS code [duplicate]VS代码中的ReactJS格式[重复]
【发布时间】：2018-05-09 11:46:42
【问题描述】：

我正在使用 ReactJS 教程here

我使用> code . 在 VS Code 1.18 版中打开了该项目。在我创建一个文件 index.js 之后，然后添加给定的代码：

class Square extends React.Component {
  render() {
    return (
        <button className="square">
        {/* TODO */}
        </button>
    );
  }
}

当我按下 Ctrl-S 保存时，VS Code 会执行以下操作：

class Square extends React.Component {
  render() {
    return (document.render() < button className = "square" > { /* TODO */ } <
    /button>
    );
  }
}

注意：对<button> 的更改。所有代码都被重新格式化。我检查了 VS 代码的格式 - 这是错误的。智能感知工作正常。我还使用"jsx": "react" 在我的src 文件夹中添加了jsconfig.json。 VS 代码真的不可用还是我遗漏了什么？

【问题讨论】：

stackoverflow.com/questions/45115112/…

标签： reactjs visual-studio-code

【解决方案1】：

我不确定如何更改 VSCode 中的默认格式规则（您可能无法更改）。

我建议使用Prettier 作为代码格式化程序。工作得很好，让你对代码的格式有很大的控制权。它也可以绑定到 eslint。

有关如何设置 prettier 和 eslint 的说明，请参阅 this article on medium for instructions。

【讨论】：