0

0

Sublime如何快速插入常用代码块 Sublime Snippet创建教程【干货】

冰火之心

冰火之心

发布时间:2026-02-01 13:41:36

|

863人浏览过

|

来源于php中文网

原创

Sublime Text 的 snippet 文件必须置于 Packages/User 目录下才生效,路径因系统而异;文件名需用英文+下划线,避免中文和多余空格;XML 格式须严格闭合,content 中的换行缩进会被原样插入。

sublime如何快速插入常用代码块 sublime snippet创建教程【干货】

Snippet 文件必须放在 Packages/User 目录下才能被识别

Sublime 不会自动扫描任意路径的 .sublime-snippet 文件。如果你把 snippet 放在桌面或项目文件夹里,它根本不会生效。正确路径是:Packages/User/xxx.sublime-snippet(可通过菜单 Preferences → Browse Packages… 打开该目录)。

  • Windows:`%APPDATA%\Sublime Text\Packages\User\`
  • macOS:`~/Library/Application Support/Sublime Text/Packages/User/`
  • Linux:`~/.config/sublime-text/Packages/User/`

注意:不要用中文路径或空格过多的文件名,部分版本会加载失败;文件名建议用英文+下划线,比如 log_console.sublime-snippet

XML 格式必须严格闭合,content 里的换行和缩进会被原样插入

一个 snippet 是标准 XML 文件,根节点必须是 ,且 都要成对出现。常见错误包括:

  • 忘记给 ![CDATA[]]> —— 特殊字符(如 {)会导致解析失败
  • 里写 Tab 缩进,结果触发时代码块会多出几级缩进(应使用空格对齐,或直接顶格写 + 用 $1 定位光标)
  • 填错,比如想用于 JavaScript 却写了 source.css,导致快捷键不响应

示例(React 函数组件 snippet):

宣小二
宣小二

宣小二:媒体发稿平台,自媒体发稿平台,短视频矩阵发布平台,基于AI驱动的企业自助式投放平台。

下载

   {
  return (
    
$2
); }; export default $1; ]]>
rfc source.js, source.jsx React Functional Component

触发关键词(tabTrigger)区分大小写,且不能含空格或特殊符号

tabTrigger 是你输入后按 Tab 触发的字符串,Sublime 默认严格匹配大小写。比如设为 Log,输入 log 再按 Tab 就没反应。

  • 推荐全小写,避免误触发
  • 不要用 console.log 这类带点的写法 —— Sublime 会把它当两个词处理,实际只认最末尾的单词
  • 如果多个 snippet 的 tabTrigger 相同,后加载的会覆盖前一个(按文件名 ASCII 排序)
  • 可配合 实现同 trigger 不同语言:比如 for 在 JS 中展开 for-of,在 Python 中展开 for-range(需分别定义 scope)

动态字段和光标跳转用 $1$2$0 控制顺序

$1 是第一个可编辑位置,$2 是第二个,$0 是最终光标停留处(常用于收尾)。它们不是变量,只是占位符编号,重复出现也没问题。

  • 比如写 console.log('$1', $2); $0,触发后先填第一个引号内内容,Tab 跳到 $2,再 Tab 跳到 $0
  • 如果希望某处默认有值(如函数名),写成 const ${1:MyComponent} = ...,中括号内是 placeholder,默认选中可直接覆盖
  • 别用 $10 这种两位数 —— Sublime 只支持单数字($1$9),$10 会被当成 $1 后跟字符 0

复杂逻辑(如条件判断、日期)无法用纯 snippet 实现,得靠插件(如 InsertDate)或自定义命令。

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
pdf怎么转换成xml格式
pdf怎么转换成xml格式

将 pdf 转换为 xml 的方法:1. 使用在线转换器;2. 使用桌面软件(如 adobe acrobat、itext);3. 使用命令行工具(如 pdftoxml)。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

1904

2024.04.01

xml怎么变成word
xml怎么变成word

步骤:1. 导入 xml 文件;2. 选择 xml 结构;3. 映射 xml 元素到 word 元素;4. 生成 word 文档。提示:确保 xml 文件结构良好,并预览 word 文档以验证转换是否成功。想了解更多xml的相关内容,可以阅读本专题下面的文章。

2094

2024.08.01

xml是什么格式的文件
xml是什么格式的文件

xml是一种纯文本格式的文件。xml指的是可扩展标记语言,标准通用标记语言的子集,是一种用于标记电子文件使其具有结构性的标记语言。想了解更多相关的内容,可阅读本专题下面的相关文章。

1086

2024.11.28

windows查看端口占用情况
windows查看端口占用情况

Windows端口可以认为是计算机与外界通讯交流的出入口。逻辑意义上的端口一般是指TCP/IP协议中的端口,端口号的范围从0到65535,比如用于浏览网页服务的80端口,用于FTP服务的21端口等等。怎么查看windows端口占用情况呢?php中文网给大家带来了相关的教程以及文章,欢迎大家前来阅读学习。

859

2023.07.26

查看端口占用情况windows
查看端口占用情况windows

端口占用是指与端口关联的软件占用端口而使得其他应用程序无法使用这些端口,端口占用问题是计算机系统编程领域的一个常见问题,端口占用的根本原因可能是操作系统的一些错误,服务器也可能会出现端口占用问题。php中文网给大家带来了相关的教程以及文章,欢迎大家前来学习阅读。

1133

2023.07.27

windows照片无法显示
windows照片无法显示

当我们尝试打开一张图片时,可能会出现一个错误提示,提示说"Windows照片查看器无法显示此图片,因为计算机上的可用内存不足",本专题为大家提供windows照片无法显示相关的文章,帮助大家解决该问题。

804

2023.08.01

windows查看端口被占用的情况
windows查看端口被占用的情况

windows查看端口被占用的情况的方法:1、使用Windows自带的资源监视器;2、使用命令提示符查看端口信息;3、使用任务管理器查看占用端口的进程。本专题为大家提供windows查看端口被占用的情况的相关的文章、下载、课程内容,供大家免费下载体验。

455

2023.08.02

windows无法访问共享电脑
windows无法访问共享电脑

在现代社会中,共享电脑是办公室和家庭的重要组成部分。然而,有时我们可能会遇到Windows无法访问共享电脑的问题。这个问题可能会导致数据无法共享,影响工作和生活的正常进行。php中文网给大家带来了相关的教程以及文章,欢迎大家前来阅读学习。

2355

2023.08.08

go语言 注释编码
go语言 注释编码

本专题整合了go语言注释、注释规范等等内容,阅读专题下面的文章了解更多详细内容。

30

2026.01.31

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
PostgreSQL 教程
PostgreSQL 教程

共48课时 | 8.2万人学习

Git 教程
Git 教程

共21课时 | 3.2万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号