如何启用Emmet'的选项卡键处理程序(HTML快捷方式)

How to enable Emmet's tab key handler (HTML shortcuts) within JavaScript files?

本文关键字:选项 处理 程序 快捷方式 HTML 何启用 启用 Emmet      更新时间:2023-09-26

默认情况下,tab键处理程序仅在JavaScript字符串中工作。我想在扩展名为.JS的JSX文件中使用它(标记不会出现在字符串中)

以下大部分内容均取自本要点

初步步骤

  1. 安装程序包控制

正在使用程序包控件。。。

  1. 为Sublime Text 3安装Emmet
  2. 安装Reg更换
  3. 安装指挥链

安装了这些

打开Preferences > Key Bindings - User并添加以下映射:

{
    "keys": ["tab"],
    "command": "chain", 
    "args": {
      "commands": [
        ["expand_abbreviation_by_tab"],
        ["reg_replace", {"replacements": ["js_class"]}]
      ]
    },
    "context": [
      {"operand": "source.js", "operator": "equal", "match_all": true, "key": "selector"}, 
      {"key": "preceding_text", "operator": "regex_contains", "operand": "(''w+>''w+|''s(''.?|a|div|span|p|button)''.''w+)", "match_all": true},
      {"key": "selection_empty", "operator": "equal", "operand": true, "match_all": true}
    ]
}

打开Preferences > Package Settings > Reg Replace > Settings - User并添加以下内容。这将根据JSX语法的要求,用className替换class

{
    "replacements": {
        "js_class": {
            "find": " class='"",
            "replace": " className='"",
            "greedy": true,
            "case": false
        }
    }
}