wxml vscode

wxml-vscode

wxml-vscode repository

Ask a question

该库我已不再维护，但需要的话可以提pr或者各自fork单独修改

Install

Enter install via F1 or CMD + Shift + P. Select: Install Extension.

characteristic

• Format function
• Highlight component function

How to use the formatting function

Formatting supports inputting the format wxml command or right-click menu through F1 or CMD + Shift + P. You can also configure wxmlConfig.onSaveFormat to enable automatic formatting after saving.

example

 <!-- if wxmlConfig.format.wrap_attributes_count === 2 -->
< button id =" x " class =" xx " > </ button >
< button id =" x " > 123 </ button >
<!-- ⬇⬇⬇⬇ -->
< button id =" x " class =" xx " />
< button id =" x " > 123 </ button >

The properties of wxmlConfig.format configuration without special instructions can be viewed here

 // 高亮的颜色，可设置每个组件的自定义颜色, tagName:color
// 例如 <custom> 想渲染成黄色，可以添加字段 "custom":"yellow"
"wxmlConfig.activeColor" : {
    "color" : " #e5c07b "
  },

  // 是否禁用高亮组件
  "wxmlConfig.activeDisable" : false ,
  // 是否开启保存自动格式化
  "wxmlConfig.onSaveFormat" : false ,

  "wxmlConfig.format" : {
    "brace_style" : " collapse " ,
    "end_with_newline" : false ,
    "indent_char" : " " ,
    "indent_handlebars" : false ,
    "indent_inner_html" : false ,
    "indent_scripts" : " keep " ,
    "indent_size" : 2 ,
    "indent_with_tabs" : true ,
    "max_preserve_newlines" : 1 ,
    "wrap_attributes_count" : 4 ,
    "unformatted" : " ['text'] " ,
    "disable_automatic_closing_labels" : false ,
    "preserve_newlines" : true ,
    "wrap_attributes" : " force-expand-multiline "
  },

  // 高亮所忽略的组件数组
  "wxmlConfig.tagNoActiveArr" : [
    " view " ,
    " button " ,
    " text " ,
    " icon " ,
    " image " ,
    " navigator " ,
    " block " ,
    " input " ,
    " template " ,
    " form " ,
    " camera " ,
    " textarea "
  ]

Concat

CHANGELOG

View version updates

LICENSE

MIT