阿里云双11免费送红包活动

捡代码论坛-最全的游戏源码下载技术网站!

 找回密码
 立即注册

QQ登录

只需一步,快速开始

扫一扫,访问微社区

搜索
关于源码区的附件失效或欺骗帖, 处理办法捡代码论坛官方微信,不定期分享免费优质资源下载
查看: 823|回复: 1

微信小程序的 vim 插件源码下载

[复制链接]

2107

主题

2296

帖子

7万

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
78761
QQ
发表于 2016-9-28 11:17:10 | 显示全部楼层 |阅读模式

Wxapp.vim

微信小程序开发 vim 插件。

提供包含文件检测、语法高亮、缩进、代码段、单词列表、语法检查等功能支持。

one

文件生成

two

插入代码块

three

使用 unite 查找并插入代码

功能列表

  • 页面目录生成的命令
  • 刷新和重建开发者工具的快捷键命令 (使用 osascript, 仅支持 macos)
  • wxml 和 wxss 文件检测, 代码高亮, 缩进设置 (推荐快捷键 =at =a{)
  • wxml, wxss 以及 javascript dictionary 文件, 使用参考:vim dictionary 的使用方式
  • wxml 和 javascript Ultisnips 代码块补全
  • wxml 和 wxss 的语法检查支持

目录生成

使用命令 Wxgen [folder] name 可以快速生成并打开一个页面所需的 wxml wxss 以及 javascript 文件,例如:

:Wxgen component product

将在 component 目录下生成 product 目录以及相关的三个文件并打开,如果命令只有一个参数则在当前目录下生成。

刷新/重建当前项目

只需要 .vimrc 中添加一个映射:

nmap <leader>r <lug>WxappReload

就可以使用快捷键就行刷新开发者工具的操作了,函数内部做了判定,如果当前文件类型为 wxml 或 wxss 时执行刷新操作,否则执行项目重建操作。

因为实现用到了 MacOS 独有的 osascript,所以只能在 Mac 系统上正常使用。

如果需要保存时让开发者工具自动刷新,请参考:https://chemzqm.me/vim-wxapp-reload

xml 编辑推荐插件:

  • xml.vim 用于辅助编辑 xml 文件, 包含自动添加匹配标签、快速修改/删除标签等功能。
  • emmet-vim 快速生成 xml 和 css, 我的配置:

        let g:user_emmet_settings = {
        \ 'wxss': {
        \   'extends': 'css',
        \ },
        \ 'wxml': {
        \   'extends': 'html',
        \   'aliases': {
        \     'div': 'view',
        \     'span': 'text',
        \   },
        \  'default_attributes': {
        \     'block': [{'wx:for-items': '{{list}}','wx:for-item': '{{item}}'}],
        \     'navigator': [{'url': '', 'redirect': 'false'}],
        \     'scroll-view': [{'bindscroll': ''}],
        \     'swiper': [{'autoplay': 'false', 'current': '0'}],
        \     'icon': [{'type': 'success', 'size': '23'}],
        \     'progress': [{'precent': '0'}],
        \     'button': [{'size': 'default'}],
        \     'checkbox-group': [{'bindchange': ''}],
        \     'checkbox': [{'value': '', 'checked': ''}],
        \     'form': [{'bindsubmit': ''}],
        \     'input': [{'type': 'text'}],
        \     'label': [{'for': ''}],
        \     'picker': [{'bindchange': ''}],
        \     'radio-group': [{'bindchange': ''}],
        \     'radio': [{'checked': ''}],
        \     'switch': [{'checked': ''}],
        \     'slider': [{'value': ''}],
        \     'action-sheet': [{'bindchange': ''}],
        \     'modal': [{'title': ''}],
        \     'loading': [{'bindchange': ''}],
        \     'toast': [{'duration': '1500'}],
        \     'audio': [{'src': ''}],
        \     'video': [{'src': ''}],
        \     'image': [{'src': '', 'mode': 'scaleToFill'}],
        \   }
        \ },
        \}

语法检查相关

  • javascript 推荐使用 eslint, 然后在 .eslintrc 中加入

    "globals": {
      "App": true,
      "Page": true,
      "wx": true
    },

    避免小程序变量的未定义错误。

  • wxss 推荐使用 stylelint, 针对 wxss 的参考配置, 安装本插件后可添加配置: let g:neomake_wxss_enabled_makers = ['stylelint'] 启用 neomake 的 wxss 的代码检测。

  • wxml 推荐使用 tidy-html5, 可使用命令 brew install tidy-html5 进行安装, 安装本插件后添加配置 let g:neomake_wxml_enabled_makers = ['tidy'] 启用 neomake 的 wxml 代码检测。

TODO

  • omnicomplete 支持
  • 文档跳转支持
  • 异步接收 console 消息
  • 编辑同步 AppData

LICENSE

源码下载:

游客,如果您要查看本帖隐藏内容请回复

微信小程序的 vim 插件源码下载 http://bbs.jiandaima.com/thread-637-1-1.html

捡代码论坛-最全的游戏源码下载技术网站! - 论坛版权1、本主题所有言论和图片纯属会员个人意见,与本论坛立场无关
2、本站所有主题由该帖子作者发表,该帖子作者与捡代码论坛-最全的游戏源码下载技术网站!享有帖子相关版权
3、捡代码论坛版权,详细了解请点击。

回复

使用道具 举报

0

主题

117

帖子

627

积分

高级会员

Rank: 4

积分
627
发表于 2017-12-3 11:02:53 | 显示全部楼层
牛 这个程序不错
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

技术支持
在线咨询
QQ咨询
3351529868

QQ|RSS订阅|Archiver|手机版|小黑屋|捡代码论坛-专业源码分享下载 ( 陕ICP备15015195号-1|网站地图

GMT+8, 2018-12-17 22:55 , Processed in 0.074527 second(s), 30 queries .

Powered by Discuz! X3.4

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表