我的 index.js 中有以下代码段
class App extends Component {
render() {
return ( <div style = { styles.app } >
Welcome to React!
</div>
)
}
}
该代码有效，但每次我保存（ctrl+s）visual studio 时都会像这样格式化 jsx：
class App extends Component {
render() {
return ( < div style = { styles.app } >
Welcome to React!
<
/div>
)
}
}
我该如何解决这个问题？谢谢
最后，诀窍是将底部工具栏上的文件格式从 JavaScript 更改为 JavaScript React。我在这里发布它以供将来参考，因为我没有找到关于这个主题的任何文档。
除了以上。如果单击“为 .js 配置文件关联”，则可以将所有 .js 文件设置为 Javascript React
在下面更改 vscode 首选项设置 > 用户设置：
"files.associations": {
"*.js":"javascriptreact"
}
您可以通过在settings.json 中添加关联来防止 VSC 错误地格式化您的 JSX
Code> Preferences>Settings
在设置窗口中搜索关联，单击settings.json 中的编辑，然后添加：
"files.associations": {
"*.js": "javascriptreact"
}
或者，使用.jsx扩展名保存文件可以在 vscode 中解决这个问题。
我遇到了同样的挑战，我希望在 vscode 中找到一种更好的方法来处理这个问题。
我注意到每次打开扩展名为.js的 react 文件时都必须完成您建议的解决方法
安装 Prettier（如果默认未安装）并尝试将其添加到您的用户或工作场所设置：
"prettier.jsxBracketSameLine": true
不要在 return 和返回的 JSX 表达式之间放置换行符。
触发自动格式化(Alt+Shift+F)并检查是否有效。