Question

Emom for Atom：在html结束标记后自动发表评论。

我无法在任何地方找到解决这个问题的方法，所以我已经在这里求助了。

http://iaintnoextra.tumblr.com/post/68089741466/automatically-add-closing-comments-to-html-using

在Sublime Text 3中，使用上面链接中的emmet用户首选项文件，emmet会在关闭html标记后自动添加注释;例如：

div.container

会产生：

<div class="container"></div><!-- /.container -->

我似乎无法在Emmet的软件包设置中找到任何地方，以便在Atom V1上实现这一点。有谁知道我可以在哪里改变它，所以它模仿相同的功能？

Answer 1

我更改了C：\ Users \\ AppData \ Roaming \ Brackets \ extensions \ user \ bracket-emmet \ node_modules \ emmet \ lib \ filter

上的html.js文件（标记生成器）

https://gist.github.com/mgundogdu38/a53af0bccd61bba4cefac56ab705d2b1

现在：

1-我找到html标签生成器库。 html.js. 2-我找到html标签生成器功能。它被称为processTag。 3-我需要属性生成器功能。它被称为makeAttributesString。克隆后我叫做“makeAttributesString2”：）

function makeAttributesString2(node, profile) {
    var attrQuote = profile.attributeQuote();
    var cursor = profile.cursor();

    return node.attributeList().map(function(a) {
        var isBoolean = profile.isBoolean(a.name, a.value);
        var attrName = profile.attributeName(a.name);
        var attrValue = isBoolean ? attrName : a.value;
        //i added there. if attribute is id. i added "." on head
        if(attrName == "id")
        {
            return "#"+(attrValue || cursor);
        }
  //if attribute is class i added "." on head
        if(attrName == "class")
        {
            return "."+(attrValue || cursor);
        }
        //else only tagname
        if (isBoolean && profile.allowCompactBoolean()) {
            return ' ' + attrName;
        }
  //end of my code
    }).join('');
}

然后我使用makeAttributesString2在proccessTag上生成评论标题。

function processTag(item, profile) {
if (!item.parent) { // looks like it's root element
    return item;
}

var attrs = makeAttributesString(item, profile); 

var cursor = profile.cursor();
var isUnary = abbrUtils.isUnary(item);
var start = '';
var end = '';

// define opening and closing tags
if (!item.isTextNode()) {
     //this is pieace of comment title.
    var attrsComment = makeAttributesString2(item,profile);
    var tagName = profile.tagName(item.name());
    if (isUnary) {
        start = '<' + tagName + attrs + profile.selfClosing() + '>';
        item.end = '';
    } else {
    //there is comment tag. i just add "<!-- "+tagName+attrsComment+" -->\n" and "\n <!-- /"+tagName+attrsComment+" -->"
    start = "<!-- "+tagName+attrsComment+" -->\n"+ '<' + tagName + attrs + '>';
        end = '</' + tagName + '>'+"\n <!-- /"+tagName+attrsComment+" -->";
    }
}

var placeholder = '%s';
// We can't just replace placeholder with new value because
// JavaScript will treat double $ character as a single one, assuming
// we're using RegExp literal.
item.start = utils.replaceSubstring(item.start, start,     item.start.indexOf(placeholder), placeholder);
item.end = utils.replaceSubstring(item.end, end,    item.end.indexOf(placeholder), placeholder);

// should we put caret placeholder after opening tag?
if (
        !item.children.length 
        && !isUnary 
        && !~item.content.indexOf(cursor)
        && !tabStops.extract(item.content).tabstops.length
    ) {
    item.start += cursor;
}

return item;
}

Answer 2

如果有人想在2018年使用VS Code执行此操作，这就是我发现的工作原理。

＆＃13;

  "emmet.preferences": {
    "filter.commentAfter": "<!-- /[#ID][.CLASS] -->"
  },
  "emmet.syntaxProfiles": {
    "html": {
      "filters": "html, c"
    }
  }

＆＃13;

将此添加到您现有的用户设置中，它应该可以正常工作：）

Atom - Emmet包：结束评论

2 个答案: