一个编辑器的构想

This topic created in 4193 days ago, the information mentioned may be changed or developed.

为了应付Linux环境程序设计的期末项目，想出了这么一个编辑器：用类似jQuery选择器和Markdown相混合的语法方便前端的开发。

当然我不懂前端，也没写过几行HTML，这个想法完全是上课犯困时用脚想出来的……

比如输入div#reg.btn，按下回车就会生成：

<div id="reg" class="btn">

</div>

还有比如输入##Title会自动生成h2标签，**hello**生成strong标签之类的Markdown语法。

我记得Sublime Text好像有一个package可以实现第一个功能。写前端的朋友说说这种工具有用吗？当然应付一下课程装装逼是足够了……

前端

div

编辑器

17 replies • 2014-12-29 18:34:57 +08:00

feiyuanqiu

Dec 29, 2014

Emmet

feiyuanqiu

Dec 29, 2014

js 的话，我知道 http://jsfiddle.net/ 的编辑器是支持这个的

Dec 29, 2014 via Android

Emmet +1

doumeki

Dec 29, 2014

notepad++也有个叫zxxx什么的插件，具体名称记不得了也有这个功能。

Bitex

Dec 29, 2014

@feiyuanqiu
@14

想起来了，是这个没错。你们觉得Emmet有很大帮助吗？

Dec 29, 2014

@Bitex 帮助太大了，这属于不用怎么学习就能带来很大提升的工具，比如输入.col-md-2*6立刻生成6个div效率太高了，Emmet基本上所有编辑器都内置或有插件了吧 http://emmet.io/download/

yyfearth

Dec 29, 2014

@doumeki Emmet

yyfearth

Dec 29, 2014

@doumeki Emmet 之前叫做 ZenCoding

shiny

PRO

Dec 29, 2014

很多年前用过一次惊叹下就没再用了。
主要时间开销是在思考而不是编码。

ivenvd

Dec 29, 2014

表示写 Slim 更简单…… Emmet 学习成本略高，生成代码之后编辑起来也不方便。

bumz

Dec 29, 2014

後來把 Emmet 刪了，因爲它的 CSS Snippet 和另一個插件衝突 :-)

其實 Sublime 自帶支持部分 Emmet 語法，比如 div#id，而更複雜之語法也鮮有用武之地。

再者諸快捷鍵，如 Ctrl+Shift+W 可快速插入標記，則 **strong** 反倒不甚方便。

綜上，若無大量手工 HTML 輸入，此類想法意義不大；當大量 HTML 需要時，所見即所得之類更佳，蓋其不僅方便輸入，更方便修改維護。

icylogic

Dec 29, 2014

html 不管是写起来还是看起来都噪音太大, 所以还是喜欢 jade, 虽然巨慢...

9hills

Dec 29, 2014 via iPhone

只有我好奇这个和Linux环境程序设计有啥关系么

Bitex

Dec 29, 2014

@shiny 没错，思考的时间远远超过编码的时间。主要是HTML或者说XML的结构太冗余，手工写起来很不爽。不过有了支持自动补全、关闭标签的编辑器，应该体验也不差。

@bumz 有什么比较好的所见即所得工具？我受不了生成大量多余的代码和行内样式。

@icylogic 这些模版语言倒的确比HTML看起来舒服多了，不过最终还是要parse成HTML。

@9hills 没有什么关系……只是要求“熟悉Linux下的开发工具，在Linux下完成C/C++项目的开发”

Bitex

Dec 29, 2014

谢谢大家，这个程序也就是在课堂验收上搞一个大装逼，真正用到生产环境的可能微乎其微……

bumz

Dec 29, 2014

@Bitex Medium 的編輯器很棒，看過作者寫的文章，Medium 連 b 與 i 的嵌套順序都是固定的。

Bitex

Dec 29, 2014

@bumz 收藏了