emmet2-mode，强化 Emmet，提升前端编码效率

[P233]

前段时间 懒猫 大佬写了 deno-bridge, 实现了 elisp 与 deno 的通信。然后这个在脑海里由来已久的想法终于有机会去实现了。

Deno 可以调用 emmet 的 NPM 包，所以实现的思路就是做一个 Emmet 的预处理器和后处理器拓展 Emmet 的功能：

1. 在 abbr 的任意位置展开，便于修改
2. 加入更多 JSX 的支持，尤其是展开 className
3. 自动检测样式标签和样式熟悉，展开 CSS
4. 添加对 CSS 和 SCSS 的 at-rules 支持
5. 展开 CSS 的伪类和伪元素
6. 大量对 CSS abbr 的改进

一些示例：

Component                     => <Component>|</Component>
Component/                    => <Component />
Component./                   => <Component className={|} />
Component.class               => <Component className={css.class}>|</Component>
Component.Subcomponent        => <Component.Subcomponent>|</Component.Subcomponent>
Component.Subcomponent.class  => <Component.Subcomponent className={css.class}>|</Component.Subcomponent>
Component.Subcomponent.a.b.c  => <Component.Subcomponent className={clsx(css.a, css.b, css.c)}>|</Component.Subcomponent>
Component.Subcomponent.a.b.c/ => <Component.Subcomponent className={clsx(css.a, css.b, css.c)} />

fz(1)      => font-size: ms(1);
p(1)(2)(3) => padding: rhythm(1) rhythm(2) rhythm(3);

p--a--b--c => padding: var(--a) var(--b) var(--c);

mA  => margin: auto;

fw2 => font-weight: 200;

t0,r0,b0,l0 === t0+r0+b0+l0

@kf => @keyframes
@in => @if not | {}

:fu =>
&:focus {
  |
}

:n(:fc) =>
&:not(:first-child) {
  |
}

:n(:fc,:lc):be =>
&:not(:first-child):not(:last-child) {
  |
}

详情请大家移步： https://github.com/P233/emmet2-mode

[DingJZ]

感觉这几年都用不上 emmet 了,祖传的技能快忘光了

[P233]

@DingJZ 哈哈 LSP 后是这样的，HTML 的优势已经不明显了，但在录入 CSS 方面还是无敌。

昨天加入了 css in js 的支持，后面改动应该不多了