继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

【金秋打卡】第11天 vue3 Prettier

有梦
关注TA
已关注
手记 82
粉丝 25
获赞 19

课程名称:基于Vue3最新标准,实现后台前端综合解


课程章节: 第一章


课程讲师:Sunday



课程内容

    

    我们知道了 ESLint 可以让我们的代码格式变得更加规范,但是同样的它也会带来开发时编码复杂度上升的问题。


那么有没有办法既可以保证 ESLint 规则校验,又可以让开发者无需关注格式问题来进行顺畅的开发呢?就是prettier


  1.     一个代码格式化工具

  2.     开箱即用

  3.     可以直接集成到 VSCode 之中

  4.     在保存时,让代码直接符合 ESLint 标准(需要通过一些简单配置)


在 VSCode 中安装 prettier 插件(搜索 prettier),这个插件可以帮助我们在配置 prettier 的时候获得提示


http://img2.mukewang.com/636302740001e28707710293.jpg


在项目中新建 .prettierrc 文件,该文件为 perttier 默认配置文件

{
  // 不尾随分号
  "semi": false,
  // 使用单引号
  "singleQuote": true,
  // 多行逗号分割的语法中,最后一行不加逗号
  "trailingComma": "none"
}

并且再设置中 勾选

http://img.mukewang.com/636302aa00012cdf08010246.jpg

那么此时的这个问题就是 prettier 和 ESLint 的冲突问题。


针对于这个问题我们想要解决也非常简单:


打开 .eslintrc.js 配置文件


在 rules 规则下,新增一条规则


'space-before-function-paren': 'off'


该规则表示关闭《方法名后增加空格》的规则




http://img4.mukewang.com/636303460001b96d10320680.jpg













 


打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP