【Canal】跨端解决方案-- chameleon 的vscode配套语法插件
chameleon项目的vscode语法插件
功能
- cml文件识别，语法高亮
- 代码片段快速创建
- template注释适配
- 动态代码片段
- 方法、变量定义跳转
- cml自定义指令代码提示
- cml文件json块检查
代码片段快速创建
| Snippet | Purpose |
| ------------------ | ------------------------------------------------------------ |
| <cml> | cml文件初始化SCSS |
| less | style声明 |
| <interface> | interface代码初始化 |
cml文件json块检查
检查用户输入json块是否符合规范，并标记错误
方法定义跳转【暂不支持数据变量、store、state等定义跳转】
其他（template注释、自定义指令提示&快速创建）
| Directives |
Purpose |
cif |
c-if="{{ $0 }}" |
celseif |
c-else-if="{{ $0 }}" |
celse |
c-else="{{ $0 }}" |
ctext |
c-text="{{ $0 }}"" |
cshow |
c-show="{{ $0 }}" |
cmodel |
c-model="{{ $0 }}" |
cfor |
c-for="{{ ${1:list} }}" c-for-index="${2:index}" c-for-item="${3:item}"$0 |
ckey |
c-key="$0" |
cbind |
c-bind:${1:event}="$0" |
查看示范戳
https://pt-starfile.didistatic.com/static/starfile/node20210208/895f1e95e30aba5dd56d6f2ccf768b57/qVsNiTJmHS1612789890818.mp4
Future
- store、state、引入组件定义跳转
- 方法提示、变量补全、引入函数补全
- format格式化
- lint校验
- 其他扩展能力
贡献者
Danjy Dang, Windsor Shi
| |
