当前位置: 首页 > 知识库问答 >
问题:

前端 - Vue2.x代码格式化:Vetur还是直接Prettier?

窦涵忍
2023-11-22

vue2.x 代码格式化应该用什么更好,vetur 还是 prettier?

如图
image.png

我知道 vetur 里格式化也可以配置 prettier 相关

但是用 vutur 更好呢?还是直接使用 prettier

找过一些相关文章,感觉两种说法都有

共有3个答案

岳玉堂
2023-11-22

最后都会变成 Volar 所以直接装 Volar 就好了,毕竟Vue3的开发算是不可避免的。

但其实最重要的是 Lint 规则。我的宪法是找一份标准规则去实施就好了,没必要自己折腾一份Lint规则,可能你你觉得喜欢舒爽了,但是别人又会觉得不舒服了。
我现在就用 Standard Config,然后就保存的时候自动格式化。Git提交的时候做好校验的钩子,不管谁来开发都按照这个标准来。可能一开始开发的时候会比较不爽,但是时间久了也就习惯了。

钮承恩
2023-11-22

多人团队协作的较大型项目,自己编写 prettier 规则文件,统一规范;
能独立开发的或者1-2人开发的中小型项目直接 Vetur 默认规则一把梭;

芮叶秋
2023-11-22

这两种工具都有其优点和缺点,具体选择哪种取决于你的需求和偏好。下面是一些关于它们的优点和缺点:

Vetur

优点:

  1. Vetur 是 Vue 官方出品的开发工具,对 Vue 的支持非常完善,包括对 Vue 的语法高亮、错误检查、代码提示等功能。
  2. Vetur 可以集成到 VS Code 中,使用起来非常方便。
  3. Vetur 支持自定义配置,你可以根据自己的需求来配置 Vetur 的行为。

缺点:

  1. Vetur 的主要功能是开发工具,而非代码格式化工具。虽然你可以在 Vetur 中配置 Prettier 来实现代码格式化,但这样做可能会增加配置的复杂性。
  2. Vetur 的支持主要停留在 Vue 2.x 版本,对 Vue 3.0 的支持可能不太完善。

Prettier

优点:

  1. Prettier 是一个非常流行的代码格式化工具,支持多种语言和配置选项。
  2. Prettier 可以直接在命令行中使用,或者集成到各种编辑器和构建工具中。
  3. Prettier 的行为非常稳定,不会因为某些配置而导致意外的行为。

缺点:

  1. Prettier 对 Vue 的支持可能没有 Vetur 完善,如果你需要使用 Vue 的一些特殊语法或功能,可能需要额外配置。
  2. Prettier 的配置相对复杂,需要花费一些时间来了解和配置。

总的来说,如果你主要使用 Vue 2.x,并且希望使用一个集成度较高的工具,那么 Vetur 可能更适合你。但如果你希望使用一个更灵活、更强大的代码格式化工具,并且对 Vue 3.0 的支持有需求,那么直接使用 Prettier 可能更好。

 类似资料:
  • 操作步骤: 菜单栏: Code —> Reformat Code 右键菜单: Reformat Code 快捷键: Mac: option + command + L Windows\/Linux: Ctrl + Alt + L 配置格式化选项 通过快捷键(Mac): option + command + shift + L 打开配置对话框 自动缩进行 操作步骤: 菜单栏: Code —> Aut

  • Go 开发团队不想要 Go 语言像许多其它语言那样总是在为代码风格而引发无休止的争论,浪费大量宝贵的开发时间,因此他们制作了一个工具:go fmt(gofmt)。这个工具可以将你的源代码格式化成符合官方统一标准的风格,属于语法风格层面上的小型重构。遵循统一的代码风格是 Go 开发中无可撼动的铁律,因此你必须在编译或提交版本管理系统之前使用 gofmt 来格式化你的代码。 尽管这种做法也存在一些争论

  • 我最近安装了VS代码和Go扩展,总的来说,它非常舒适,但是格式化代码不起作用,无论是ALT Shift F还是上下文菜单,还是on save。 我能把代码格式化成什么格式? ,和从命令行可以正常工作。几天前,一切都很顺利。

  • Clang接受以下代码,但gcc拒绝它。 以下是错误消息:

  • 概述 毫末科技的前端代码自动化的技术栈为: 制作前端组件:imgcook 前端组件文档:storybook 前端组件仓库:bit(bit.dev) 前端组件快速引入项目:xmind2code(毫末自研) + ice 组件编写规范见: 毫末xmind2code封装uniapp组件规范 其他相关技术 开源xLayers  商业Supernova  教程 imgcook 请见官方文档