https://atom.io/packages/emmet-simplified
This is a fork of the emmet-atom package, and its main goal is to solve the keybinding conflicts with Atom itself that existed in the original package. The original package overwrote keybindings such as the ctrl + shift + M for toggling the Markdown preview, the ctrl + , for opening the Settings View, and tab for Atom's autocomplete
https://atom.io/packages/git-time-machine
http://philhosoft.github.io/Software/GitHub-Atom-review/
https://atom.io/packages/markdown-mindmap
Markdown Writer
code
(cmd-'
)- bold (
cmd-b
) - italic (
cmd-i
) strike through(cmd-h
)'''code block'''
(shift-cmd-"
)<kbd>key</kbd>
(cmd + k
)- unordered list
(shift-cmd-U
)0. ordered list
(shift-cmd-O
)> blockquote
(shift-cmd->
)- [ ] task list
(markdown-writer:toggle-task
)
https://github.com/atom/bracket-matcher
Use ctrl-m to jump to the bracket matching the one adjacent to the cursor. It jumps to the nearest enclosing bracket when there's no adjacent bracket,
Use ctrl-cmd-m to select all the text inside the current brackets.
Use alt-cmd-. to close the current XML/HTML tag.
https://atom.io/packages/hyperclick
https://atom.io/packages/hyperlink-hyperclick
Open link in Atom
- ctrl-shift-o from Atom core
- Cmd+click from Hyperlink Hyperclick which requires Hyperclick
2. RegEx Search & Replace
Search for
^(.*)$
and replace with "$1",
.
A quick way to change the case of the current selection.
https://en.wikipedia.org/wiki/Snake_caseSnake case (or snake_case) is the practice of writing compound words or phrases in which the elements are separated with one underscore character (_) and no spaces, with each element's initial letter usually lowercased within the compound and the first letter either upper- or lowercase—as in "foo_bar" and "Hello_world".
https://benmccormick.org/2017/05/29/atom-tips/
5. Check Timecop and clean up plugins that you’re not using
https://atom.io/packages/maximize-panesmaximize-panes:maximize | cmd-shift-enter |
https://github.com/santip/resize-panes
https://github.com/atom/atom/pull/7354
pane:enlarge | cmd-alt-= | enlarge the current pane by 10% |
panes:shrink | cmd-alt-- | shrink the current pane by 10% |
https://atom.io/themes/unity-ui
An Atom theme for a more native experience on OS X
https://github.com/zhuochun/md-writer
Execute command Markdown Writer: Create Default keymaps to add the recommended keymaps
ctrl-alt-[1-5] | switch among H1 to H5. |
cmd-’ | code |
cmd-b | bold |
cmd-i | italic |
cmd-h | |
shift-cmd-" | ’‘’code block’’’ |
- unordered list | (shift-cmd-U) |
0. ordered list | (shift-cmd-O) |
Package sync
Package sync lets you synchronize packages installed between computers. This comes in handy if you are working on different working environments.
https://atom.io/packages/package-sync
https://atom.io/packages/atom-package-sync
Synchronize packages, settings, keymaps, user styles, init script and snippets automatically across Atom instances. The code is based on the great sync-settings package.
- Login with your Google account (Github coming soon)
https://atom.io/packages/package-sync
https://medium.freecodecamp.org/atom-treasures-82a64ac391c
Emmet is a universal plugin (it works with many popular text editors) to write HTML and CSS in a more efficient way thanks to intelligent textual expansions.
https://medium.freecodecamp.org/atom-treasures-82a64ac391c
Highlight selected
Highlight selected allows you to highlight your selected words throughout the file that you are editing. You can use Ctrl-U or Cmd-U to multi selected the words
Sort lines
Sort lines
Sort your lines in alphabetic order
Double tag
Double tag
Double tag allows you to edit both the start and end HTML tags at the same time. This is extremely useful when editing big files with a lot of HTML.
https://atom.io/packages/jumpy
- Enter jump mode
- shift + enter NOTE: This particular hotkey conflicts with the very awesome Hydrogen package. Please rebind jump mode to something else or override it for Jumpy (see below)
- Reset first character entered
- backspace
- Cancel/exit jump mode (any)
- shift + enter
- enter
- esc
- space
Script (by Kyle Kelley) is a simple plugin to run the code from the current file as a whole, or via a selection. It supports plenty of different languages out of the box.
https://atom.io/packages/script
Pigments (by Cédric Néhémie) is a simple plugin which scans source files in your project directories looking for colors and will build a palette with all of them. It supports most of the color transformations functions and expressions of the three biggest CSS pre-processors out there (LESS, Sass & Stylus).
Tern is a stand-alone code-analysis engine (created by Marijn Haverbeke, the author and maintainer of Eloquent JavaScript and CodeMirror) to improve JavaScript programmers’ productivity. It provides autocompletion, function argument hints, jump-to-definition, and various automatic refactoring operations. Here’s Atom’s integration with Tern.
https://atom.io/packages/document-outline
Show a hierarchical outline of a text document
https://atom.io/packages/atom-csv-markdown
https://atom.io/packages/markdown-table-editor
https://atom.io/packages/spell-check
http://timgthomas.com/2015/04/simple-file-tricks-with-atom/
You may have used Atom’s “rename” feature a time or two, but did you know you can also use it to move files, as well? When you open the “rename” palette, Atom displays the file’s full path (relative to the project root). Want to relocate the file? Simply change the path and hit return:
The next time you need to copy and paste a file, why not use Atom instead of your OS’s file explorer? Right-click a file, select “Duplicate”, and Atom prompts you for the file’s new name. Much like moving a file, just change the path to wherever you’d like to copy the new file, hit return, and presto!
- [linter](https://atom.io/packages/linter) [link](https://atomlinter.github.io/)* [jsonlint](https://atom.io/packages/linter-jsonlint)
https://hackernoon.com/making-atom-even-more-awesome-my-setup-e7a89969a876
Find previous: shift + enter in the search dialog
https://github.com/atom/find-and-replace/issues/453
https://atom.io/packages/split-diff
https://shd101wyy.github.io/markdown-preview-enhanced/#/presentation
--- presentation: width: 800 height: 600 --- <!-- slide -->
Apache Zeppelin (https://zeppelin.apache.org/docs/0.7.0/interpreter/markdown.html)
Jupyter (http://jupyter-notebook.readthedocs.io/en/stable/examples/Notebook/Working%20With%20Markdown%20Cells.html)
brew install graphviz
Installing the language-plantuml (plafue)
Installing the plantuml-preview Package
- You can install Graphviz (not required) to generate all diagram types.
- Code block with
puml
orplantuml
notation will be rendered by PlantUML.
https://atom.io/packages/atom-mermaid
https://shd101wyy.github.io/markdown-preview-enhanced/#/code-chunk
```bash {cmd=true} ls . ``` ```javascript {cmd="node"} const date = Date.now() console.log(date.toString()) ```
https://github.com/GitbookIO/gitbook
https://github.com/t9md/atom-vim-mode-plus/wiki/TIPS
In insert-mode, hitting escape to close autocomplete popup result in normal-mode, but want to remain in insert-mode.
By default
To change default behavior of
escape
always escape insert-mode
regardless of autocomplete's popup.To change default behavior of
escape
, set following keymap in your keymap.cson
.'atom-text-editor.vim-mode-plus.insert-mode.autocomplete-active':
'escape': 'autocomplete-plus:cancel'
Or you can use different keymap to explicitly close autocomplete-plus's popup like bellow.
'atom-text-editor.vim-mode-plus.insert-mode.autocomplete-active':
'ctrl-g': 'autocomplete-plus:cancel'
Just Select the text, use command palette
https://discuss.atom.io/t/deleting-all-empty-lines/29358(cmd + shift + P)
> delete-whitelines:toggle or alt+shift+D
(for MAC & windows) to remove empty lines within the selected text area.
Add this in your init.coffee file:
atom.commands.add 'atom-workspace', 'lines:delete-whitelines', ->
buffer = atom.workspace.getActiveTextEditor().getBuffer()
newLines = buffer.getLines().filter (line) -> line isnt ''
buffer.setText newLines.join '\n'
atom.commands.add 'atom-workspace', 'lines:delete-whitelines-regex', ->
buffer = atom.workspace.getActiveTextEditor().getBuffer()
buffer.replace /\n\n/g, '\n'
It boils down to the fact that people want to control whether VCS ignored files are visible in the tree view separately from whether they are visible in other parts of the editor. For example, I may not want VCS ignored files to show up when I use the fuzzy finder or in Find in Projects, but I may want them to show up in the tree view so I know what files are actually in the folder.
An Atom package that lets developers share their workspace with team members and collaborate on code in real time.
https://discuss.atom.io/t/installed-packages-list-into-single-file/12227apm list --installed --bare
apm uninstall PACKAGENAME
https://discuss.atom.io/t/project-search-does-not-index-files-in-gitignore/2804
You can change that behavior by editing your config file. Or by opening the settings view (cmd-,) and unchecking
Exclude VCS Ignored Paths
https://github.com/atom/language-html/issues/9
install 'Emmet' package
shift+cmd+A to wrap in tag [http://docs.emmet.io/actions/wrap-with-abbreviation/]
Both atom-wrap-in-tag and atom-tag-wrapper work prefectly.
https://github.com/atom/settings-view/issues/394
Find should allow you to search within the Settings View #394
https://daijiang.name/en/2015/04/10/useful-atom-shortcuts/
atom-material-syntax
# great syntax highlightingatom-material-ui
# great user interface
vim-mode
# I like the vim mode of moving cursor
Zen
# distraction free
I also like the multi-cursor feature from sublime text, which I feel is a must for me. Shortcuts within Atom:
ctrl-D
if you select a world, then you hitctrl-D
and Atom will select next same word for you. Then you can either type directly (which will replace the old word) or use left or right arrow to append things.ctrl-leftclick
you can use this to select locations for multi-cursor wherever you want.shift-alt-down
orshift-alt-up
to put multi-cursor at multiple lines. Or you can select multiple lines first, thenselection -- split into lines
(in Mac, you can usecmd-shift-L
, sadly, for windows and linux so far, no similar shortcut for this [in sublime, we can usectrl-shift-L
].).
https://atom.io/packages/jumpy
An Atom package that creates dynamic hotkeys to jump around files and across visible panes.
Duplicate line
Cmd + Shift + D (Mac)
Select the next matching characters
Cmd + D (Mac)
Ctrl + D (Windows/Linux)
This command allows you to select the next matching word or characters to that which is highlighted. You can then (using the auto generated multiple cursors) delete, edit or update the highlighted values.
Select all matching characters
Cmd + Ctrl + G (Mac)
Alt + F3 (Windows/Linux)
Fuzzy finders have been a key feature on modern editors since TextMate first popularized the ⌘T command1 for searching through project files. ⌘T (or ⌘P) still works great in Atom, but what you may not know is that Atom provides 2 other versions of the command. ⌘B searches only among currently open files. ⇧⌘B searches only among files that are “dirty” according to git2. Both of those options are built in. You can also find other uses for the fuzzy-finder if you start exploring plugins, including atom-fuzzy-grep, a plugin that lets you use the fuzzy-finder interface to search file contents using grep, ack, ag, or ripgrep.
v i p
.d
to delete selected text.i
to startinsert-mode
.- Type
abc
thenescape
.
better find mode
# scroll
'ctrl-f': 'vim-mode-plus:scroll-full-screen-down'
'ctrl-b': 'vim-mode-plus:scroll-full-screen-up'
'ctrl-d': 'vim-mode-plus:scroll-half-screen-down'
'ctrl-u': 'vim-mode-plus:scroll-half-screen-up'
'ctrl-e': 'vim-mode-plus:mini-scroll-down'
'ctrl-y': 'vim-mode-plus:mini-scroll-up'
'g 0': 'vim-mode-plus:move-to-beginning-of-screen-line'
'g ^': 'vim-mode-plus:move-to-first-character-of-screen-line'
'g $': 'vim-mode-plus:move-to-last-character-of-screen-line'
'g altgraph $': 'vim-mode-plus:move-to-last-character-of-screen-line'
'0': 'vim-mode-plus:move-to-beginning-of-line'
'^': 'vim-mode-plus:move-to-first-character-of-line'
https://github.com/atom/find-and-replace/issues/149Exclude file types or paths
!.git
!**/node_modules/**,!**/bower_components/**
!*.java
https://discuss.atom.io/t/search-file-directory-pattern-not-working/16900
Where Atom accepts file globs, it uses the minimatch library 266. It looks like
+(js|tests)/**/*.js
might work.https://flight-manual.atom.io/using-atom/sections/find-and-replace/
You can limit a search to a subset of the files in your project by entering a glob pattern into the "File/Directory pattern" text box. For example, the pattern
src/*.js
would restrict the search to javascript files in the src
directory. The "globstar" pattern (**
) can be used to match arbitrarily many subdirectories. For example, docs/**/*.md
will match docs/a/foo.md
, docs/a/b/foo.md
, etc. You can enter multiple glob patterns separated by commas, which is useful for searching in multiple file types or subdirectories.
- markdown-preview-plus@2.2.2
- markdown-assistant@0.1.0(Upload images from the clipboard automatically, win10 下失败,osx 完美成功,粘贴图片直接转成 md 文本,不要太棒,优雅的没朋友)
- qiniu-uploader@0.0.3
- markdown-writer@2.3.2(在设置里面设置一下,就拥有了正常 md 编辑器的编辑 md 的各种快捷键 例如 cmd + b, cmd + shift + k 插入链接,而且更棒非常值得一试)
- markdown-toc@0.4.1
https://atom.io/packages/markdown-writer- markdown-assistant@0.1.0(Upload images from the clipboard automatically, win10 下失败,osx 完美成功,粘贴图片直接转成 md 文本,不要太棒,优雅的没朋友)
- qiniu-uploader@0.0.3
- markdown-writer@2.3.2(在设置里面设置一下,就拥有了正常 md 编辑器的编辑 md 的各种快捷键 例如 cmd + b, cmd + shift + k 插入链接,而且更棒非常值得一试)
- markdown-toc@0.4.1
To use features such as
create draft/post
, Markdown-Writer needs to be configured to know the path to your blog.
Go to Settings (
cmd-,
) -> Packages -> markdown-writer
-> Settings -> Set siteLocalDir
and related.print:
- https://atom.io/packages/print-code (contents of the text editor, with line numbers)
export-html works better, but only supports source windows (not the Markdown Preview or RST Plantdoc Preview).
ctrl + g Goto line
⌘ + r Goto symbol
https://gist.github.com/chrissimpkins/5bf5686bae86b8129bee
Find Matching Bracket | ⌃-m |
Cut to End of Line | ⌃-k |
Delete Line | ⌃-⇧-k |
Go to Matching Bracket | ⌃-m |
Convert to Upper Case | ⌘-k-u |
Convert to Lower Case | ⌘-k-L |
Deleting empty lines at end of text files
https://atom.io/docs/latest/
Command Palette + cmd-shift-P
cmd-O -> Open files
http://nuclide.io/docs/hack/
http://www.sitepoint.com/10-essential-atom-add-ons/
Highlight Selected
Open Recent
Pretty JSON
atom-beautify
xml-formatter
escape-utils
Set Syntax
http://hahack.com/codes/learn-react-native-for-android-01/
- browser-plus:在 Atom 中内嵌一个浏览器窗口,方便页面调试(其实 Atom 本身就是一个浏览器);
- minimap:如果你对 Sublime Text 的 minimap 念念不忘;
- react:React 的语法补全和智能重排;
- react-snippets:React 的代码段;
- highlight-selected:高亮当前双击选中的标记;
- jshint:检查 JavaScript 的语法,支持 JSX (需要在插件设置中开启 Support Linting JSX);
- emmet:用 emmet (Zen Coding)方式快速编写页面;
- vim mode
- Atom算是一款web app,源码都是 CoffeeScript 写的,连界面都可以用 CSS 来自定义,扩展可以用JS开发,完全可以深度定制打造自己的IDE。Sublime基于Python,两者扩展性都非常强。
代码片段
alt-shift-S
查看当前可用代码片段在~/.atom
目录下snippets.cson
文件中存放了你定制的snippets
- seti-uiA dark colored UI theme for Atom with custom file icons. (+Seti Syntax)
atom-material-ui 好看到爆
atom-material-syntax - 美化
atom-beautify 一键代码美化
file-icons 给文件加上好看的图标
atom-minimap 方便美观的缩略滚动图 - git
atomatigit 可视化git操作 - 代码提示
emmet 这个不用介绍了吧,前端开发必备,谁用谁知道;
atom-ternjs js代码提示很强大,高度定制化
docblockr jsdoc 给js添加注释
color-picker 取色器 必备插件
pigments 颜色显示插件 必装
terminal-panel 直接在atom里面写命令了
svg-preview svg预览 - 便捷操作
advanced-open-file 快速打开、切换文件 - 代码校验
linter代码校验工具;A Base Linter with Cow Powers - Web前端
autoclose-html 闭合html标签
language-vue-component Atom编写Vue高亮
vue-autocompile Auto compiles vue in atom
language-vue Syntax highlighting for vue component files
Hit
Cmd-Alt-O
/Ctrl-Alt-O
to open the file list to the directory of the current file. As you edit the path the file list will automatically show matching files and directories. Hit Tab
to autocomplete the path.