我使用Visual Studio Code对Vue.js组件进行编码,并且需要重新格式化该组件的代码。
我没有找到任何内置的插件,首选插件是vue-buetify
在安装后通知
扩展程序中有很多错误,请不要使用它,更好的选择是vetur
然后,我通过安装Vetur进行了尝试,但是没有地方可以看到美化当前编辑器中代码的选项。该Shift+ Alt+F 命令没有效果。
如何实际美化(重新格式化)Vue组件的代码?
自从我以前的项目停止格式化一天以来,我就一直在进行格式化方面的工作。我认为这是当前的最新状态:
使用扩展名vetur
和更漂亮(特别是,esbenp.prettier-vscode
漂亮-代码格式化程序)。(您可以通过Vue.js Extension Packesbenp.prettier-vscode
等预先安装这些文件。)
Vetur
是vue的(当前)强制性默认工具。不接受替代品。
Prettier本身不支持.vue文件,因此默认情况下该文件类型为禁用:https : //github.com/prettier/prettier-vscode/issues/338。
但是Vetur理解了它的局限性,而是将.vue文件的各个部分的格式委托给可能不同的格式化程序。但是,默认情况下,它将HTML节以外的所有内容委派给Prettier。https://vuejs.github.io/vetur/formatting.html。它禁用HTML节的格式。
Vetur开发人员不赞成使用js-beautify-html,尽管它显然仍然可以正常工作:https ://vuejs.github.io/vetur/formatting.html 。而且他们目前没有提出其他建议。
长久以来,对HTML的更好支持(如果仅存在的话)将是显而易见的选择。当前(2018年5月),更漂亮的HTML格式为JSX。提到了许多微妙之处,但是我已经掌握的一个问题是JSX将begin / empty / end标记转换为空标记,例如。显然,React和(我相信)Vue不喜欢这样,因此vetur禁用了HTML的Prettier。
因此,我将继续在vetur设置中启用js-beautify-html,希望做到最好,并保持双眼平整。但是我是一个肤浅的编码器,以至于我可能永远不会跳过它的已知问题。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句