Atom设置指南

Posted on Edited on In Disqus:

Atom

官网

安装atom

1
2
3
$ sudo add-apt-repository ppa:webupd8team/atom
$ sudo apt-get update
$ sudo apt-get install atom

atom packages

atom-chrome

git-plus

markdown-pdf

markdown-preview-plus

markdown-writer

tidy-markdown

emmet

html快速编写工具

jshint

js语法插件

minimap

与sublime相似的代码预览

pigments

markdown-preview-enhanced

markdown-preview-enhanced

mermaid 渲染 flowchart 和 sequence diagram

mermaid 文档

KaTex 渲染数学表达式

需要学习LaTeX语法

KaTeX

参考1

$$\oint_C x^3, dx + 4y^2, dy 2 = \left( \frac{\left(3-x\right) \times 2}{3-x} \right)$$

$$\sum_{m=1}^\infty\sum_{n=1}^\infty\frac{m^2,n} {3^m\left(m,3^n+n,3^m\right)}$$

$$\phi_n(\kappa) = \frac{1}{4\pi^2\kappa^2} \int_0^\infty \frac{\sin(\kappa R)}{\kappa R} \frac{\partial}{\partial R} \left[R^2\frac{\partial D_n(R)}{\partial R}\right],dR$$

sp160804_133226

PlantUML 渲染图形

PlantUML

WaveDrom 来渲染 digital timing diagram.

WaveDrom

使用json样式文本

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
{signal: [
  {name:'clk', wave: 'p.....PPPPp....' },
  {name:'dat', wave: 'x....2345x.....', data: 'a b c d' },
  {name:'req', wave: '0....1...0.....' }
],
head: {text:
  ['tspan',
    ['tspan', {class:'error h1'}, 'error '],
    ['tspan', {class:'warning h2'}, 'warning '],
    ['tspan', {class:'info h3'}, 'info '],
    ['tspan', {class:'success h4'}, 'success '],
    ['tspan', {class:'muted h5'}, 'muted '],
    ['tspan', {class:'h6'}, 'h6 '],
    'default ',
    ['tspan', {fill:'pink', 'font-weight':'bold', 'font-style':'italic'}, 'pink-bold-italic']
  ]
},
foot: {text:
  ['tspan', 'E=mc',
    ['tspan', {dy:'-5'}, '2'],
    ['tspan', {dy: '5'}, '. '],
    ['tspan', {'font-size':'25'}, 'B '],
    ['tspan', {'text-decoration':'overline'},'over '],
    ['tspan', {'text-decoration':'underline'},'under '],
    ['tspan', {'baseline-shift':'sub'}, 'sub '],
    ['tspan', {'baseline-shift':'super'}, 'super ']
  ],tock:-5
}
}

sp160804_133234

Viz.js 来渲染 dot language 图形.

dot

1
2
3
4
5
6
7
8
9
graph ethane {
        C_0 -- H_0 [type=s];
        C_0 -- H_1 [type=s];
        C_0 -- H_2 [type=s];
        C_0 -- C_1 [type=s];
        C_1 -- H_3 [type=s];
        C_1 -- H_4 [type=s];
        C_1 -- H_5 [type=s];
}

sp160804_133243

reveal.js 来渲染漂亮的 presentations

幻灯片样式

presentations