prettier格式化代码

作者: miao8862 | 来源:发表于2021-05-12 23:11 被阅读0次

    prettier格式化,可以让整个项目按照同一种风格习惯写代码,不会出现一些人用两个空格,一些人用四个空格,让代码看起来很乱,有代码洁癖的人真是无法忍受

    这里是prettier日常配置,记录一下

    1. vscode下载prettier插件

    2. 在项目根目录添加配置文件

    • 创建.prettierrc.js文件
    module.exports = {
      // 2个空格渐进
      "tabWidth": 2,
      // 不使用缩进符,使用空格
      "useTabs": false,
      // 使用单引
      "singleQuote": true,
      // 行尾不使用;
      "semi": false,
      // 一行多少字符会换行
      "printWidth": 200,
      // 箭头函数,只有一个参数时,不需要括号
      "arrowParents": "avoid"
    }
    
    • .prettierignore文件
    *.min.js
    *.handle.js
    *.min.css
    lib/
    node_modules/
    dist/
    

    3. 默认使用prettier格式化文件

    在单个文件里,右击,选择"format document with",选择prettier

    4. 在单个文件使用快捷

    • mac:options + shift + f
    • windows:alt + shift + f

    5. 如果要全局格式化

    // 设置全局格式化的范围
    "scripts": {
      "pretitter": "pretitter --write './src/**/*.vue' ./src/**/*.js ./common/*.js"
    }
    
    • 执行npm run pretitter进行全局格式化

    6. 如果发现不生效,有可能需要项目安装prettier插件

    npm i prettier
    重启vscode和项目,查看是否生效

    相关文章

      网友评论

        本文标题:prettier格式化代码

        本文链接:https://www.haomeiwen.com/subject/smyudltx.html