Skip to content

hago-slack-helper

介绍

hago-slack-helper is a VS Code extension for HAGO FETEAM

特性

vue, typescript, javascript, sass 代码片段
预览图片,写入尺寸

快速上手

`snippets`

打开 snippets 编辑页面

按"Shift (⇧) + Command（⌘）+ p"，输入slack.openWebview

点击 ts/vue 文件右上角的 snippets 功能按钮

使用 snippets

直接在文件中输入各个prefix
在 snippets 编辑页面中，选择copy按钮

`image`

使用 image snippets

打开一个目标编辑器
右键选择资源中的一张图片
选择复制图片片段代码
粘贴至目标编辑器

支持自定义配置或读取 snippets 配置

修改 configslack.ImageSnippetTemplate,添加变量｜在自定义 snippets 中增加包含${img_url}的代码
打开一个目标编辑器
右键选择资源中的一张图片
选择复制图片片段代码
粘贴至目标编辑器

支持${img_url}变量并自动填写${img_width}和${img_height}

项目中${img_url}将会增加标记位, 选择快速修复 || 框选包含变量的内容，右键->选择选择图片并替换变量
选择一张图片(.png||.jpg)

支持hover图片地址,预览图片

鼠标移动到图片地址，自动预览图片
支持定位文件和打开目标文件
支持 alias
支持读取图片的大小和尺寸

配置

name	type	default	description
slack.ImageSnippetTemplate	["string", "array"]	["@include bg('`${img_url}`', `${img_width}`px, `${img_height}`px);"]	Customize image snippets template,support `${img_url}` `${img_width}` `${img_height}`

指令

slack.openWebview 打开slack-helper的 webview 界面
slack.openSnippets 打开slack-helper全局 snippets 配置
slack.reset 拉取团队 snippets 配置，重载slack-helper的本地缓存
slack.clean 清除slack-helper本地缓存
slack.selectImageCoverVariableByAction 选择图片并替换当前行(+-5)内容中的图片变量
slack.copyImageSnippet 选择图片并替换Rang中的图片变量