Sublime Text Emmet JSX selfClosingStyle

Question

你好，我使用带有 Emmet 的最新 Sublime Text 4 和内置 Syntax -> Javasript > JSX 的 reactjs 源代码，它可以工作。

我将默认的 emmet 设置 "jsx_prefix": true, 更改为 false，它起作用了 - 现在我可以在没有 < 的情况下扩展标签。

但我想更改默认扩展 Component/ -> <Component> 到 <Component />

我尝试将 "markup_style": "html", 更改为 xhtml 或 xml 但它不起作用。

并且在 emmet 设置中我可以看到这个参数，这也许可以解决我的问题：

    // See `GlobalConfig` interface for supported properties: https://github.com/emmetio/emmet/blob/master/src/config.ts
    // Example:
    // "config": {
    //  "markup": {
    //      "snippets": {
    //          "foo": "foo.bar>baz"
    //      },
    //      "options": {
    //          "output.selfClosingStyle": "xhtml"
    //      }
    //  }
    // }
    "config": {},

因为我不懂 TS，所以我无法阅读 GitHub 中的源代码来解决这个问题，谁能知道如何使用这个 config 参数而不是像示例中的一个片段，但是对于带有 "output.selfClosingStyle": "xhtml"?

的 JSX

我试着写这样的东西（但不行）：

"config": {
        "markup": "jsx",
        "options": {
            "output.selfClosingStyle": "xhtml"
        }
    }

请帮助我在 ST4 中使用带有 emmet 的 JSX 自闭标签。

Answer 1

在 Sublime Text 中，您可以为语法类型（markup 或 stylesheet）或特定语法全局指定配置。

语法在 Emmet 配置的 syntax_scopes 选项中列出，它是语法名称到 Sublime Text 内部范围的映射（您也可以像这样创建自己的语法）。

在您的情况下，您应该为 jsx 语法指定配置，如下所示：

{
    "config": {
        "jsx": {
            "options": {
                "output.selfClosingStyle": "xhtml"
            }   
        }
    }
}

Sublime Text Emmet JSX selfClosingStyle

Sublime Text Emmet JSX selfClosingStyle

javascript

reactjs

jsx

sublimetext