Vue 扩展“Volar”没有在脚本设置中格式化代码答案

【问题标题】：Vue Extension "Volar" is not formatting code inside Script setupVue 扩展“Volar”没有在脚本设置中格式化代码
【发布时间】：2022-06-24 12:33:49
【问题描述】：

有没有办法在脚本设置中制作 Volar 扩展来格式化代码？我没有使用 Vetur，因为它与 vue 3 及其新语法不够兼容。

【问题讨论】：

您是否在 VS Code 中使用 CTRL+SHIFT+P 和“格式化文档”操作？它在 Volar 中对我有用。如果您的意思是 ESLint 格式规则等，请查看 github.com/sethidden/vue3-eslint-stylelint-demo
当我提出这个问题时，我的问题是 eslint 配置。我正在尝试 Vue 3 + vite，但在那里我的配置有点迷失了。那时我结束了责备Volar。我的错？？？？感谢您的回复！

标签： vue.js

【解决方案1】：

按照nuxt3官方文档添加volar扩展如链接所示。 (https://vuejs.org/guide/typescript/overview.html)

并将以下代码添加到项目顶部的 .vscode/setting.json 中。

"[vue]": {
    "editor.formatOnSave": true,
    "editor.defaultFormatter": "Vue.volar"
},

如果不立即适用，按 command + shift + p 键运行命令窗口，然后运行 > Developer: Reload Window 命令。

【讨论】：