美文网首页工作生活前端
VSCode之美化前端代码

VSCode之美化前端代码

作者: 迷糊银儿 | 来源:发表于2019-06-30 20:21 被阅读0次

    问题:编码前端代码后格式混乱,定位问题尤其考验强迫症患者及眼睛

    简介

    • Beautify是格式化代码的插件
    • 可美化JS、JSON、CSS、Sass、HTML(其他类型的文件不行)

    教程

    1. 安装Beautify插件 image.png 2. 在项目根目录下新建文件.jsbeautifyrc
      规则参考
    {
     "indent_char": " ",
      "indent_size": 0,
      "eol": "\n",
      "end_with_newline": false,
      "indent_with_tabs": false,
      "preserve_newlines": true,
    "wrap_attributes":"auto",
    "comma_first": false,
      "indent_level": 0,
      "keep_array_indentation": false,
      "keep_function_indentation": false,
      "space_after_anon_function": false,
      "space_after_named_function": false, 
      "space_before_conditional": false,
      "space_in_empty_paren": false,
      "space_in_paren": false
    }
    
    1. mac 下在vscode中打开目标文件,按快捷键shift+option+f即可

    问题

    1. 这插件会把jsx当做js来格式化,怎么让VScode中的beautify插件不格式化react项目中的jsx代码?

      右下角,把语言模式 JavaScript 改成 JavaScript React image.png

    相关文章

      网友评论

        本文标题:VSCode之美化前端代码

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