天天看点

【Vue 开发实战】生态篇 # 24:提升开发效率和体验的常用工具:ESLint、Prettier、vue-devtools

说明

【Vue 开发实战】学习笔记。

Vetur

  • 语法高亮
  • 标签补全、模板生成
  • Lint 检查
  • 格式化

比如:模板生成

【Vue 开发实战】生态篇 # 24:提升开发效率和体验的常用工具:ESLint、Prettier、vue-devtools

ESLint

  • 代码规范
  • 错误检查

配置规则:

【Vue 开发实战】生态篇 # 24:提升开发效率和体验的常用工具:ESLint、Prettier、vue-devtools

Prettier

  • 格式化

跟 eslint 有些重叠,eslint 侧重校验, Prettier 主要侧重格式化,在一起使用需要做一些配置,防止两者使用冲突,比如使用了​

​@vue/prettier​

【Vue 开发实战】生态篇 # 24:提升开发效率和体验的常用工具:ESLint、Prettier、vue-devtools

配置保存时的规则,比如保存时单引号,对象里面最后加逗号(加逗号可以避免提交代码更改两行)

Vue DevTooIs

  • 集成Vuex
  • 可远程调试
  • 性能分析

继续阅读