Mr.Yuan Mr.Yuan

苟正其身矣,于从政乎何有?不能正其身,如正人何?

目录
sublime3 格式化 vue
/  

sublime3 格式化 vue

sublime 添加格式化 .vue 文件. 以及格式化后还是乱的部分解决办法.

安装HTML-CSS-JS Prettify步骤

  1. 使用快捷键 ctrl + shift + p 打开 Package Control 键入 Install Package
    imagepng

  2. 选择 Install Package 之后,左下角会进入加载
    imagepng

  3. 稍等一会之后会出现这个.
    imagepng

  4. 搜索HTML-CSS-JS Prettify
    imagepng

  5. 点击安装
    安装完成后, 默认的格式化快捷键是 ctrl+shift+h

  6. 添加 vue 格式的支持和node_path
    找到 Preferences -> Package Settings -> HTML/CSS/JS Prettify -> Plugin Options - Default中的

"node_path":
    {
        "windows": "D:/nodejs/node.exe",
        "linux": "/usr/bin/nodejs",
        "osx": "/usr/local/bin/node"
    },

绑定你系统的node地址

"html":
        {
            "allowed_file_extensions": ["htm", "html", "xhtml", "shtml", "xml", "svg", "vue"],
            "allowed_file_syntaxes": ["html", "xml"],
            "disallowed_file_patterns": []
        },

在 allowed_file_extensions 中添加 "vue"

问题

到此就可以给 vue 文件格式化了, 不过我在使用的时候依然有点问题. 💢

  1. 没有按照tab为4的size来格式化
  2. 格式化后template依然是乱的.
  3. sass也是乱的.

是这样的:
imagepng
嘿嘿, 这是要我关编辑器? 逼死强迫证系列. 💢

解决

  • 问题1:
    按照第6步打开 Plugin Options - Default 在最底部找到 "use_editor_indentation": false,false改为true

  • 问题2
    按照第6步打开 Prettify Preferences - Default

    "html":
    {
        // Rules added here apply only to HTML files. They take precedence over all
        // of the settings in the 'all' category above.

        // You can add other .jsbeautifyrc rules in this section too.

        // e.g. {{#foo}}, {{/foo}}
        "indent_handlebars": false,

        // Indent <head> and <body> sections
        "indent_inner_html": false,

        // [keep|separate|normal]
        "indent_scripts": "keep",

        // List of tags that should not be reformatted
        "unformatted": ["a", "span", "img", "code", "pre", "sub", "sup", "em", "strong", "b", "i", "u", "strike", "big", "small", "pre", "h1", "h2", "h3", "h4", "h5", "h6"]
    },

unformatted 设置成空的. "unformatted": [] 就可以了.

  • 问题3
    不知道怎么解决 trollface
    哪位朋友知道的, 麻烦告诉一下.~ 😏

以上的所有修改操作推荐把要修改的项 copy 到 - User 中 不推荐直接修改 - Default

插件地址

插件地址

格式化结果

imagepng
总算舒服了.

总结.

baidu 里全是 ctrl+c,ctrl+v 的吗?


标题:sublime3 格式化 vue
作者:K
地址:https://pala.icu/articles/2019/12/21/1576858113162.html