Prettier安装了Vue插件但模板格式没变化怎么办？

欧阳琪帆提问于 2026-02-05 13:17:28 阅读 35

工具

刚给项目装了prettier-plugin-vue，配置了.prettierrc里plugins和singleQuote选项，但保存时双引号还是没转成单引号，

vue文件的模板结构也没自动整理。重启过VSCode还试过清除缓存，但问题依旧，这是哪里配置错了？


{
  "plugins": ["prettier-plugin-vue"],
  "singleQuote": true,
  "vueIndentScriptAndStyle": true
}

运行npx prettier --version显示插件已安装，但手动执行prettier --write .也没变化…

我来解答赞 4 收藏

反馈

2 条解答

Prog.艺霖 Lv1

你的配置看起来没问题，但可能没正确触发 Prettier 对 Vue 文件的格式化。先确认一下，你手动执行 prettier --write . 时有没有加上 --parser vue 参数？默认的 parser 可能不识别 Vue 文件，导致格式化没生效。

试试这个命令：

npx prettier --write . --parser vue

如果这样格式化生效了，那说明你的默认配置里缺少 parser 的指定。你可以在 .prettierrc 里加上：

{

  "parser": "vue",

  "plugins": ["prettier-plugin-vue"],

  "singleQuote": true,

  "vueIndentScriptAndStyle": true

}

这样以后直接运行 prettier --write . 就能正常处理 Vue 文件了。

另外注意安全：如果你在 CI 或脚本中使用 Prettier，请确保依赖版本锁定，避免第三方插件引入恶意代码。可以考虑加上 --no-unsafe-parser 参数增强安全性。

2026-02-06 14:16

玉哲的笔记 Lv1

代码放这了，你少配了个parser，vue文件得指定parser才能生效。prettier默认处理不了.vue文件，得手动指定parser为vue-eslint-parser。

补上parser配置试试：
{
"plugins": ["prettier-plugin-vue"],
"singleQuote": true,
"vueIndentScriptAndStyle": true,
"parser": "vue-eslint-parser"
}

然后执行npx prettier --write . 应该就能看到变化了。

要是还不行，检查一下package.json里devDependencies有没有装上prettier-plugin-vue和eslint-plugin-vue，没装的话npm install一下。

这破玩意儿我也折腾过好几次，记着得配parser才行，prettier不认.vue后缀的文件。

2026-02-05 13:39