How we manage icons in Rocket.Chat?

  • 2020-3-6
  1. Add a new SVG icon file into app/ui-master/public/icons folder
  2. Run the automation script node ../generateSprite.js to generate icons.svg from those SVG files in the above folder. (the SVG's filename is exactly the icons' identifier)
  3. In the meteor.startup callback function, using Asset.getText to download icons.svg file as plain text to the client first, and then with the help of injectIntoBody function to insert the entire content as raw text into the body.

Note: the generated icons.svg the file contains multiple icons, where we use the tag symbol as a delimiter.

Remove default ABC input method on Mac

  • 2020-3-5


code ~/Library/Preferences/

Delete the dict that represents the ABC method and it will take effect after rebooting the system.

Vim & VSCode Advanced - Day 7

  • 2020-3-4


  1. :tabo[nly] Close all tabs except the active one; :tabnew Create a new tab; :tabNext Move to the next tab; :tabprevious Move to the previous tab;
  2. :pwd Print the current working directory
  3. Use / search to move the sursor faster
  4. Use relative line numbers.
  5. :his[tory] to list command history
  6. Text Obejcts: i/a/ys/cs + w/s/p/]/)/"/'/t
  7. Parameterized Text Objects:
    • f, F => "find" the next character
    • t, T => up to the next character
    • / => Search (up to the next character)


  1. command+t Search symbol in the file
  2. command+shift+t Search symbol in the workspace
  3. command+b Show/Hide activity bar
  4. ctrl+p Go to file
  5. command+p Git: push changes to the remote


  1. Learning Vim in a Week
  2. Mastering the Vim Language
  3. 20 VS Code Shortcuts for Faster Coding

Vim Advanced - Day 6

  • 2020-3-3
  1. C-n In the native Vim, we can use this shortcut to achieve keyword completion. But in the VSCodeVim the behavior is something different because completion is the killer feature equipped with VSCode that you don't need to type any extra keys to open completion window. So C-n here means toggling cursor among all available candidates.
  2. The Vim supports scp protocol and you can use vim scp://aliyun/Downloads/app.js to edit app.js file under ~/Downloads directory in your remote aliyun machine.
  3. Local Bookmarks Management
    • :marks [a-zA-Z] List all bookmarks (or specified bookmarks only)
    • m+a-z Create a local bookmark
    • m+A-Z Create a global bookmark
    • `+a-zA-Z Jump to the bookmark
    • '+a-zA-Z Jump to the bookmark (stop at the beginning of your bookmarked line)
    Combined with the powerful C-o (Jump backward the cursor's location) and C-i (Jump forward the cursor's location), we can move the cursor from place to place easily.

Ref: Why I love Vim: It’s the lesser-known features that make it so amazing

Vim Advanced - Day 5

  • 2020-3-2
  1. g+i insert at the end of last change
  2. Insert Mode: C-o command execute command and return to Insert Mode
  3. g+J: like "J", but without inserting spaces
  4. :reg {arg} show the contents of registers mentioned in {arg}, using spaces to separate multiple args
  5. Y, g+g: yank N lines into a register
  6. ]+p: like p, but adjust indent to current line
  7. [+p: like P, but adjust indent to current line
  8. g+p: like p, but leave cursor after the new text
  9. g+P: like P, but leave cursor after the new text
  10. u undo last change
  11. C-r redo last change
  12. U restore last changed line

Vim Advanced - Day 4

  • 2020-3-1
  1. Number+| Jump to the column Number
  2. Visual mode: o toggle cursor position between the beginning and the end of the highlighting
  3. Visual mode: c-q or c-v enter visual-block mode
  4. Visual mode: g+v start highlighting on previous visual area
  5. Notice the key l. We always use this key to move right but forget another function that it has - It represents the character under cursor. That is to say, if you want to perform an operation on the char under cursor, we can use l to represent it. For instance, we can use y+s+l+surroundings enclose the char with the surroundings we provided.
  6. g+m to the middle of the line


  1. Learn Vim For the Last Tiem: A Tutorial and Primer
  2. VSCodeVim Roadmap

Vim Advanced - Day 3

  • 2020-2-29
  1. g+a Show ASCII value of character under cursor
  2. <+< Shift lines to left
  3. >+> Shift lines to right
  4. C-a Increase number under cursor
  5. y+s+text-object+surrondings Enclose the text object with surroundings
  6. c+s+text-object+old-surrondings+new-surrondings Change the surrondings of the text object
  7. d+s+text-object+surrondings ReMove the surroundings of the text object
  8. V enter visual line mode first; S+surrondings add surrondings linewise. (for instance, V C <p class='important'>)
  9. Nouns: w: word; s: sentence; p: paragraph; t tag;
  10. D Remove the text after the cursor of the current line, which is similar to C (C will also enter into insert mode)
  11. * Search for other instances of the word under your cursor
  12. ^ Move to the first non-blank character in the line, which is a little different from 0 (Move to the beginning of the line)
  13. $ Move to the end of the line
  14. Move by word: w/W: Move forward one word; b/B Move back one word; e/E Move to the end of the word;
  15. Move by sentence: ( Move back one sentence; ) Move forward one sentence
  16. Move by paragraph: { Move back one paragraph; } Move forward one paragraph
  17. Move by screen: H Move to the top of the screen; M Move to the middle of the scrren; L Move to the bottom of the screen; C-u Move up half a screen; C-d Move down half a screen
  18. Move by file: gg Move to the beginning of the file; G Move to the end of the file
  19. C-i Jump forward the cursor's location; C-o Jump backward the cursor's location (I guess Vim maintains a cursor location stack to achieve it)
  20. s delete the character under cursor and enter into insert mode (think about x)
  21. S dlete the current line and enter into insert mode, which equals to c+c
  22. Substitution: :%s/foo/bar/gc Replace "foo" to "bar" on every line with confirm (! Note that :%s/foo/bar/cg is not working, the sequence of c and g is sensitive); :s/foo/bar/gc Replace "foo" to "bar" on current line
  23. / Search forward; ? Search backward

Ref: Learn Vim For the Last Tiem: A Tutorial and Primer

Vim Advanced - Day 2

  • 2020-2-28

Ouch! It's the daily Vim time! I'll share with you the new Vim skills/knowledge I've learnt today :)

  1. :e! drop all the changes of the current file.

  2. vim - we use this pattern in bash to edit the output of another command. For instance:

    info sed | vim - # use Vim to edit the output of the `info sed`

  3. C clear text after the cursor of the current line, which equals to the c+$. Kindly notice the difference between c+c and C, the former is to clear the whole line and enter insert mode but the latter is to remove text after the cursor and switch to insert mode.

How to redirect stdout/stderr to file?

  • 2020-2-28

One common pattern that you perhaps saw before is using 2>&1, which means redirect stderr to stdout. Combined with it, we can use > or >> to redirect both stdout/stderr to some file.

command 2>&1 > file # or commmand 2>&1 >> file

Note: the different between > and >> is that > will overwrite the previous content of the file and >> will append the text at the bottom of the previous file.


The bash 4 gives you another option to finish the same task as we described before:

command &> file

The above command will redirect both stdout and stderr to a file.

Writes output both to the screen and a file

Sometimes we'd like to write the stdout/stderr to some file and keep the output on the screen at the time. What should we do in this situation?

One useful command that helps us to do this task is the tee. The tee command writes the output to the screen (stdout/stderr) and to the file in the meanwhile. For example:

date | tee file

The above command will print the current date on the scrren and save it the file.

One common need that we want to achieve is print the original output of the command to the screen and do some operations (for instance, we pass it as input to the sed to do the substitution).

The below example will writes the output of the first command and remove the color codes (eg. [39m) using sed and then save the substituted one to the file:

command 2>&1 | tee /dev/stderr | gsed -ur 's/\x1B\[([0-9]{1,3}(;[0-9]{1,2})?)?[mGK]//g;' &> ~/.log

PS: The native sed command in the BSD systems (eg. MacOS) do not support -u option, which will force the output to be line buffered. A more detailed explanation of this option is appended below:

sed -u: Force output to be line buffered, printing each line as it becomes available. By default, output is line buffered when standard output is a terminal and block buffered otherwise. See setbuf(3) for a more detailed explanation.

PSS: -r option of sed is aimed to use extended regular expression syntax.

Vim Advanced - Day 1

  • 2020-2-27

P paste before the cursor

Comment: We usually use p to paste yanked content but barely use P. The p and P pair is common in Vim. There are other pairs whose behaviors are similar to it too, such as x (delete the character under the cursor), X (delete the character before the cursor, which equals to backspace); o (create a new line below the current one), O (create a new line above the current one); f (find a character forward), F (find a character backward); t (jump forward until find a character), T (jump backward until find a character)...

Panes Management

  • C-w+s Split the window horizontally. Help You Remember: the s is the first letter of the word split, and Vim will split the window horizontally by default. (We can the command :sp or :split to do same the work too, but personally I think using shortcuts is more efficient.)
  • C-w+v Split the window vertically. Help You Remember: the v is the first letter of the word vspit, which is the abbreviation of the phrase vertically split. Note: +some situations, we prefer using command form to the shortcuts. For example, if we need to create a new file somewhere and want to edit it in a new pane. Here we can use :vsp ../definition/IModalCreation.ts to create a file IModalCreation.ts under the folder definition and to edit it in a vertically split pane (typically the right pane).
  • C-w+> Increase the width of the current pane.
  • C-w+< Decrease the width of the current pane.
  • C-w++ Increase the height of the current pane.
  • C-w+- Decrease the height of the current pane. Note: +can resize only 1 unit of width or height one time, so feel free to add a Number C-w to resize faster (for instance, 50 C-w >).
  • Besides,+ can the command :new or :vnew to create a new pane with empty content horizontally or vertically.
  • C-w+h Switch to pane to the left.
  • C-w+l Switch to pane to the right.
  • C-w+j Switch to pane to the above.
  • C-w+k Switch to pane to the below.
  • C-w+w/C-w Switch to panel clockwise.
  • C-w+_ Maximize current pane vertically
  • C-w+| Maximize current pane horizontally
  • C-w+= Make all panes equal size
  • :close Close current pane (For VSCodeVim, I use my own shortcut to close it that is much faster)


  • Tue Mar 3 22:08:47 CST 2020 (Add C-w+_, C-w+| and C-w+=)