0

0

sublime如何创建和使用自定义代码片段 (Snippet)? (实例讲解)

裘德小鎮的故事

裘德小鎮的故事

发布时间:2026-01-05 16:01:02

|

452人浏览过

|

来源于php中文网

原创

sublime text代码片段可快速插入常用代码结构,需通过tools→developer→new snippet创建xml文件,设置content、tabtrigger、scope和description,并保存至user包目录下以.sublime-snippet结尾,支持占位符、变量及多平台路径。

sublime如何创建和使用自定义代码片段 (snippet)? (实例讲解)

Sublime Text 的代码片段(Snippet)能帮你快速插入常用代码结构,比如 HTML 标签、函数模板或日志语句。创建和使用都很简单,关键是把逻辑理清、路径放对、语法写准。

一、创建自定义 Snippet 文件

菜单栏依次点击:Tools → Developer → New Snippet…,会打开一个预设 XML 模板。你需要修改几处关键内容:

  • :填你要展开的代码,用 $1$2 表示光标停靠位置(按 Tab 切换),$0 是最终光标位
  • :设定触发关键词,比如输入 log 再按 Tab 就展开
  • :指定生效范围,如 source.js(JS 文件)、text.html.basic(HTML 文件)
  • :可选,描述用途,会在命令面板里显示

举个 JS 控制台日志片段的例子:



log
source.js
console.log() with placeholder

二、保存 Snippet 到正确目录

保存时注意文件名必须以 .sublime-snippet 结尾,例如 log.sublime-snippet。默认保存路径是 Sublime 的用户数据目录:

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

存对位置才能被识别。改完不用重启,保存即生效。

AI-Text-Classifier
AI-Text-Classifier

OpenAI官方出品,可以区分人工智能书写的文本和人类书写的文本

下载

三、在编辑器中使用 Snippet

有两种常用方式:

  • 在支持的文件类型中,直接输入 tabTrigger(比如 log),然后按 Tab 键,自动展开并定位到第一个占位符
  • Ctrl+Shift+P(Win/Linux)或 Cmd+Shift+P(macOS),输入 Insert Snippet,从列表里选择(适合记不清触发词时)

提示:如果没反应,先确认当前文件后缀是否匹配 <scope></scope> 设置,比如你在 .html 文件里用了 source.js 就不会触发。

四、进阶技巧:变量与环境信息

Snippet 支持内置变量,让代码更智能:

  • $TM_FILENAME:当前文件名
  • $TM_FILEPATH:完整路径
  • $CURRENT_YEAR$CURRENT_MONTH:自动插入当前日期
  • ${1:default}:带默认值的占位符,光标停在这儿,可直接回车跳过或修改

例如写一个带版权头的 JS 片段:

* @file $TM_FILENAME
* @author Your Name
* @date $CURRENT_YEAR-$CURRENT_MONTH-$CURRENT_DATE
*/
$0]]>

基本上就这些。不复杂但容易忽略 scope 和保存路径,调通一次,后面写代码效率明显不一样。

热门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)。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

1945

2024.04.01

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

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

2119

2024.08.01

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

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

1163

2024.11.28

js正则表达式
js正则表达式

php中文网为大家提供各种js正则表达式语法大全以及各种js正则表达式使用的方法,还有更多js正则表达式的相关文章、相关下载、相关课程,供大家免费下载体验。

530

2023.06.20

js获取当前时间
js获取当前时间

JS全称JavaScript,是一种具有函数优先的轻量级,解释型或即时编译型的编程语言;它是一种属于网络的高级脚本语言,主要用于Web,常用来为网页添加各式各样的动态功能。js怎么获取当前时间呢?php中文网给大家带来了相关的教程以及文章,欢迎大家前来学习阅读。

556

2023.07.28

js 字符串转数组
js 字符串转数组

js字符串转数组的方法:1、使用“split()”方法;2、使用“Array.from()”方法;3、使用for循环遍历;4、使用“Array.split()”方法。本专题为大家提供js字符串转数组的相关的文章、下载、课程内容,供大家免费下载体验。

739

2023.08.03

js是什么意思
js是什么意思

JS是JavaScript的缩写,它是一种广泛应用于网页开发的脚本语言。JavaScript是一种解释性的、基于对象和事件驱动的编程语言,通常用于为网页增加交互性和动态性。它可以在网页上实现复杂的功能和效果,如表单验证、页面元素操作、动画效果、数据交互等。

6090

2023.08.17

js删除节点的方法
js删除节点的方法

js删除节点的方法有:1、removeChild()方法,用于从父节点中移除指定的子节点,它需要两个参数,第一个参数是要删除的子节点,第二个参数是父节点;2、parentNode.removeChild()方法,可以直接通过父节点调用来删除子节点;3、remove()方法,可以直接删除节点,而无需指定父节点;4、innerHTML属性,用于删除节点的内容。

492

2023.09.01

JavaScript浏览器渲染机制与前端性能优化实践
JavaScript浏览器渲染机制与前端性能优化实践

本专题围绕 JavaScript 在浏览器中的执行与渲染机制展开,系统讲解 DOM 构建、CSSOM 解析、重排与重绘原理,以及关键渲染路径优化方法。内容涵盖事件循环机制、异步任务调度、资源加载优化、代码拆分与懒加载等性能优化策略。通过真实前端项目案例,帮助开发者理解浏览器底层工作原理,并掌握提升网页加载速度与交互体验的实用技巧。

59

2026.03.06

热门下载

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

精品课程

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

共48课时 | 10.4万人学习

Git 教程
Git 教程

共21课时 | 4.1万人学习

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

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