vscode中react代码格式化问题解决方案


今天在学习的过程中遇到一个头疼的问题,react引入antd组件时代码被格式化的混乱,所以上网查了一些方法,并在此总结一下。

插件选择

这里我们使用prettier,如果安装过其它格式化插件建议卸载,个人感觉一个就够用了,好多插件会弄的有点混乱

image-20210422165725967

配置设置

在设置中随便选一个对settings.json进行编辑

image-20210422170632874

加入如下代码

"editor.formatOnSave": true,
"editor.formatOnType": true,
"editor.formatOnPaste": true,

返回我们的react项目

右键选择格式化文档方式选择prettier

image-20210422171343455

image-20210422171400359

或者直接在settings.json中添加

"[javascriptreact]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
},

大功告成!


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM