问题描述
我正在 VSCode 1.58.2 中开发一个 Vue.js 项目。
我的 .vscode/settings.json
{
"editor.formatOnPaste": true,"editor.formatOnSave": true,"editor.codeActionsOnSave": {
"source.fixAll": true
},"editor.defaultFormatter": "octref.vetur","javascript.format.insertSpaceBeforeFunctionParenthesis": true,"javascript.format.placeOpenBraceOnNewLineForControlBlocks": false,"javascript.format.placeOpenBraceOnNewLineForFunctions": false,"typescript.format.insertSpaceBeforeFunctionParenthesis": true,"typescript.format.placeOpenBraceOnNewLineForControlBlocks": false,"typescript.format.placeOpenBraceOnNewLineForFunctions": false
}
感谢您的帮助。
解决方法
在你的 settings.json 你应该有:
-
[vue]: {"editor.defaultFormatter": "octref.vetur"}
-
"vetur.format.defaultFormatter.html": "js-beautify-html"
告诉 vue 如何格式化<template>
-
完整配置:
{
"editor.formatOnSave": true,"vetur.format.defaultFormatter.html": "js-beautify-html","[vue]": {
"editor.defaultFormatter": "octref.vetur"
}
}
注意:如果您有多个 .vue 文件的格式化程序,您必须指定使用哪个格式化程序,否则保存时格式将不知道使用哪个,并且默认不执行任何操作。这将选择“Vetur”作为默认值。
,尝试了一段时间后,我可以解决问题。我的修改 .vscode/settings.json:
{
"editor.formatOnPaste": true,"editor.formatOnSave": true,"editor.codeActionsOnSave": {
"source.fixAll": true
},"editor.defaultFormatter": "octref.vetur","javascript.format.insertSpaceBeforeFunctionParenthesis": true,"javascript.format.placeOpenBraceOnNewLineForControlBlocks": false,"javascript.format.placeOpenBraceOnNewLineForFunctions": false,"typescript.format.insertSpaceBeforeFunctionParenthesis": true,"typescript.format.placeOpenBraceOnNewLineForControlBlocks": false,"typescript.format.placeOpenBraceOnNewLineForFunctions": false,"[vue]": {
"editor.defaultFormatter": "octref.vetur"
}
}