鍍金池/ 問答/HTML/ vscode的vetur插件如何格式化html代碼?

vscode的vetur插件如何格式化html代碼?

我知道可以使用

{
    "vetur.format.defaultFormatter.html": "js-beautify-html"
}

來格式化html代碼,但是通常情況下組件的指令、props、事件會(huì)有很多,如何讓這個(gè)插件定義一些配置來達(dá)到屬性換行書寫,如下:

<i-control-layout 
      ref="controls" 
      :btnCol="3" 
      :toolbar="treeToolbar" 
      moreBtnType="default"
 ></i-control-layout>
回答
編輯回答
司令

vuejs的官方插件有個(gè)叫eslint-plugin-vue,搭配eslint使用
所以eslint配置文件(.eslintrc.js)如下:

module.exports = {
    //...
     extends: [
    // https://github.com/vuejs/eslint-plugin-vue#priority-a-essential-error-prevention
    // consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules.
    'plugin:vue/recommended', // vue-template默認(rèn)是essential 需要改成recommend
    // https://github.com/standard/standard/blob/master/docs/RULES-en.md
    'standard'
  ],
  plugins: ['vue'],
    rules: {
         'vue/max-attributes-per-line': [
              2,
              {
                singleline: 3,
                multiline: {
                  max: 3,
                  allowFirstLine: false
                }
              }
          ]
    }
}
2018年8月19日 15:31