wxml-vscode

wxml-vscode 仓库

提问题

安装

通过 F1 或者 CMD + Shift + P 输入 install. 选择: Install Extension.

特性

  • 格式化功能
  • 高亮组件功能

如何使用格式化功能

格式化 支持 通过 F1 或者 CMD + Shift + P 输入 format wxml 命令 或者右键菜单,也可以配置 wxmlConfig.onSaveFormat 开启保存后自动格式化

目前可配置项

v0.0.3 增加属性

wxmlConfig.format.wrap_attributes_count 超过几个 attributes 属性则全部转行

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>

wxmlConfig.format 可配置的属性可以这里看

// 高亮的颜色,emm暂时只支持这样写
"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,
"preserve_newlines": true,
"wrap_attributes": "force-expand-multiline"
}, // 高亮所忽略的组件数组
"wxmlConfig.tagNoActiveArr": [
"view",
"button",
"text",
"icon",
"image",
"navigator",
"block",
"input",
"template",
"form",
"camera",
"textarea"
]

Vscode插件--微信小程序格式化以及高亮组件wxml-vscode的更多相关文章

  1. vsCode 开发微信小程序插件

    用 vsCode 开发微信小程序可以配置以下插件,让开发更美好: 1. vscode weapp api 2. vscode wxml 3. vscode-wechat 4. Easy WXLESS ...

  2. 微信小程序--搜索关键词高亮

    代码地址如下:http://www.demodashi.com/demo/14249.html 一.前期准备工作 软件环境:微信开发者工具 官方下载地址:https://mp.weixin.qq.co ...

  3. [小程序开发] 微信小程序audio音频播放组件+api_wx.createAudioContext

    引言: audio是微信小程序中的音频组件,可以轻松实现小程序中播放/停止音频等自定义动作. 附上微信小程序audio组件的相关属性说明:https://mp.weixin.qq.com/debug/ ...

  4. 微信小程序笔记<七>视图层 —— wxml

    微信小程序的视图层由 *.wxml 组成,wxml与html一样属于标签语言,但wxml与html的标签截然不一样. xwml特性 一.数据绑定 <!--wxml--> <view& ...

  5. 微信小程序页面调用自定义组件内的事件

    微信小程序页面调用自定义组件内的事件 page page.json { "usingComponents": { "my-component": ". ...

  6. 微信小程序(二十)-UI组件(Vant Weapp)-01按装配置

    1.官网 https://vant-contrib.gitee.io/vant-weapp/#/intro https://gitee.com/vant-contrib/vant-weapp 2.按装 ...

  7. 微信小程序富文本渲染组件html2wxml及html2wxml代码块格式化在ios下字体过大问题

    1.组件使用: 之前微信小程序的富文本渲染组件用的wxParse,对普通富文本确实可以,但是对于代码格式pre标签则无法使用. 下面这个html2wxml很不错,可以支持代码高亮. 详细文档:http ...

  8. 【微信小程序】使用vscode编写微信小程序项目

    1. 在微信开发者工具(以下简称:开发者)中新建一个模板微信小程序 2. 在开发者中将模拟器分隔开 3. 设置在保存时编译 4. 在vscode中打开项目目录 5. 下载代码提示插件 这样就可以在vs ...

  9. 微信小程序搜索并高亮关键字

    更多解读可使用博客: https://www.jianshu.com/p/86d73745e01c 实现流程:1.在文本框中输入关键字key,如"比赛",检索出比赛相关的列表key ...

随机推荐

  1. (转)sdd for aix 安装及基本命令

    总结出自多个文件(自己做的项目和网上找的资料) 原文:http://blog.csdn.net/yujin2010good/article/details/11395701 一.sddpcm安装 要安 ...

  2. 07-spring之三大框架的整合

    1 三大框架整合理论 2 导包(42个) 1 hibernate 1 hibernate/lib/required 2 hibernate/lib/jpa | java persist api jav ...

  3. InnoDB还是MyISAM?

    两种类型最主要的差别就是Innodb 支持事务处理与外键和行级锁.而MyISAM不支持.所以MyISAM往往就容易被人认为只适合在小项目中使用. 我作为使用MySQL的用户角度出发,Innodb和My ...

  4. hbase常识及habse适合什么场景

    当我们对于数据结构字段不够确定或杂乱无章很难按一个概念去进行抽取的数据适合用使用什么数据库?答案是什么,如果我们使用的传统数据库,肯定留有多余的字段,10个不行,20个,但是这个严重影响了质量.并且如 ...

  5. checkbox判断选中的三种方法

    方法一: if ($("#checkbox-id")get(0).checked) {     // do something } 方法二: if($('#checkbox-id' ...

  6. SpringBoot如何集成Jedis

    添加jedis依赖 在项目pom.xml文件中添加依赖 <!-- 添加jedis依赖 --> <dependency> <groupId>redis.clients ...

  7. C#多线程进度条

    public class ZyjProgressBar : System.Windows.Forms.ProgressBar { //用于跨线程访问控件的委托 private delegate voi ...

  8. SQL Server 2008 报错:已成功与服务器建立连接,但是在登录前的握手期间发生错误

    今天SqlServer 2008连接数据库时报错:已成功与服务器建立连接,但是在登录前的握手期间发生错误.在连接到 SQL Server 2008 时,在默认的设置下 SQL Server 不允许远程 ...

  9. [Environment Build] Win10下配置Apach Tomcat

    Download URL http://tomcat.apache.org/download-80.cgi Get Binary Distributions according to you PC c ...

  10. [vijos]lxhgww的奇思妙想(长链剖分)

    题意 题目链接 Sol 长链剖分 又是一个用各种花式技巧优化的暴力 它的主要思想是:对于每个节点,把深度最深的子节点当做重儿子,它们之间的边当做重边 这样就会有一些非常好的轻质 所有链长总和是\(O( ...