时间戳

首页 > 解决方案 > 如何在 dart 的 vs-code 中创建 emmet 或建设性代码段

visual-studio-code - 如何在 dart 的 vs-code 中创建 emmet 或建设性代码段

问题描述

我想标题很明显，我想要定义一个片段，它应该将类似的东西转换为：

textcontrollers*4

至

final TextEditingController $1 = TextEditingController();
final TextEditingController $2 = TextEditingController();
final TextEditingController $3 = TextEditingController();
final TextEditingController $4 = TextEditingController();

或建设性的，例如：

list_of_textcontrollers

至

final TextEditingController $ = TextEditingController();//and if i press enter it should make a new line with same snippet
final TextEditingController $ = TextEditingController();

老实说，我是在 vs-code 中制作扩展和片段的新手（或根本没有），但我在谷歌搜索我想要的东西时没有任何运气，任何帮助将不胜感激。

标签： visual-studio-codecode-snippetsemmetvscode-snippets

解决方案

settings.json首先在（全局或工作区）中定义一个用于emmet扩展的文件夹

一个好的位置是.vscodeWorkspace/Project 的目录

"emmet.extensionsPath": "/c:/Projects/CoolStuff/.vscode"

在 Windows 上，您需要使用这种格式来指定路径。

在这个文件夹中创建一个文件snippets.json

{
  "html": {
    "snippets": {
      "tec": "{final TextEditingController ${1:name} = TextEditingController();}"
    }
  }
}

重新启动 VSC，否则snippets.jsonemmet 不会读取对的更改。

为片段使用短名称，因为如果您想使用*4语法，您必须输入全名。

现在您可以键入tec*4 Enter并Tab填写名称。

如果您删除占位符:name，您会得到制表位，但最后没有一个。

使用选择| Copy Line Down用于其他用例。

推荐阅读