prettier和vetur(Vue-Offical)格式化选择问题

1,806 阅读2分钟

前提条件

项目已经初始化使用了prettier,esLint。同时项目也配置了.prettierrc.js文件大概是这样,vscode安装了vue-offical(vetur)和prettier esLint两个插件

module.exports = {
  printWidth: 100,
  tabWidth: 2,
  useTabs: false, // 是否使用tab进行缩进,默认为false
  singleQuote: true, // 是否使用单引号代替双引号,默认为false
  semi: false, // 行尾是否使用分号,默认为true
  arrowParens: 'always',
  endOfLine: 'auto',
  vueIndentScriptAndStyle: true,
  htmlWhitespaceSensitivity: 'strict',
};

项目产生问题

image.png

项目出现了这样的问题,一直提示pretter的问题,点击pretter进入到pretter的文章中有这样的解决方案一 parser": "flow",虽然这种方式能解决一些问题,但是这不是根本解决方案。 同时我点击快速修复后,只是出现了短暂修复,又被格式化工具给格式成这样的问题了。对于我这样的菜鸟而言,不能解决这样的问题让我很奔溃。所以我就一直在百度解决方案,终于让我看到了解决方案(其实这个时候应该能想到格式化工具的问题,还是自己太菜了---)

解决方案

在开头的前提条件中已经提到,vscode中同时安装了vetur和prettier Eslint插件,可能是安装前后的问题,默认格式化程序是vuter,所以自动格式化的插件就是vuter,但是呢,项目中的格式化配置文件使用的pretter,所以一直格式化不成功,同时报警告,只需要把默认格式化改成pretter就可以了

结尾

希望大家在开发中能够提前了解自己电脑的插件配置(痛哭),也希望这篇文章能帮到各位跟我一样困惑好久的码农们。 同时感谢你能够看完这边文章,希望能给你提供到帮助