老外收集的Atom编辑器最好的一些插件

布满荆棘的人生 2022-09-21 05:38 300阅读 0赞

## [   Introduction][Introduction] ##

[Atom][] is an open source text editor made by GitHub that lets you easily customize every aspect of it. The entire application is written in JavaScript, CSS, and HTML so hacking the core and writing packages is much more straight forward.

*  Cross-platform: Works on OS X, Windows, and Linux.
 *  Package manager: There are thousands of plugins created that make Atom amazing. [Atom Packages][].
 *  Autocompletion: An extensive autocomplete system for every language out there.
 *  File system browser: The filetree and fuzzy finder make opening projects and files very simple.
 *  Multiple panes: Split your workspace into multiple panes to compare and edit code across files.

## [\#Why Atom?][Why Atom] ##

A text editor for the home of tomorrow...today!

width="850" height="478" src="https://www.youtube.com/embed/Y7aEiVwBAdk?feature=oembed" frameborder="0" allowfullscreen="" style="box-sizing: border-box; display: block; width: 501.188px; color: rgb(82, 76, 76); font-family: acumin-pro, sans-serif; font-size: 20px; line-height: 32.6px; margin: 35px auto !important; border: 1px solid rgb(241, 242, 241) !important; max-width: none !important; border-radius: 0px !important; background: rgb(241, 242, 241);">

The main goal of Atom is that anyone can hack the core to make it do what they want. Everything is customizable via CSS or JavaScript. If you want a feature that doesn't exist it's very easy to start writing your own package.

Themes in Atom are often high quality and are flexible. When you install one of the 1,246 themes available, anything you don't like can be changed by editing one of the `.less` files in it's package folder.

## [\#Features][Features] ##

Atom doesn't have features in the traditional sense, it creates packages that add to it's `hackable` core. Any of the 91 (at this time) packages Atom uses [can be found on their website][]. This allows for a lot of creativity because when a package doesn't exist it can easily be created or extended.

## [\#Fuzzy Finder][Fuzzy Finder] ##

`Ctrl + T`

Atom indexes your current project and makes it easy to search from the Fuzzy Finder for any file you want. Mind you unless you tell the settings for filetree to ignore folders like `node_modules` or `vendor` you can end up with slow searches or sluggish performance due to the number of files typically present in these folders.

![atom fuzzy finder][]

## [\#Tree View][Tree View] ##

`Ctrl + \`

View and open files in your current project. Provides many common actions like cutting and pasting folders, copying the proejct path to a file, or opening a file up in your native file explorer.

![atom tree view][]

## [\#Package Installer][Package Installer] ##

When you want a new package or theme installed, open your settings and click Install. Here you can search for packages or themes, and when you find one you want click install. Typically you shouldn't need to restart Atom but in rare cases it's necessary.

![atom package installer][]

## [\#Best Settings][Best Settings] ##

First couple things you want to change in the main settings for Atom is:

*  Setting the files you want ignored underIgnored Names this will enhance Atom's performance greatly.
 *  Setting the Project Home where projects are assumed to be.

![atom settings][]

*  Check the Hide Ignored Names from your file tree so that `.DS_Store` and `.git` don't appear needlessly.

![atom settings][atom settings 1]

## [\#Plugins to Make Atom Act Like Sublime Text][Plugins to Make Atom Act Like Sublime Text] ##

The following plugins give Atom some of the most popular features that Sublime Text 3 has.

If you see any missing please comment!

## [\#minimap][minimap] ##

A preview and easily scrollable view of the full source code. A bunch of plugins have been written from [Code Glance][] to [Linter][] that greatly enhance minimap's helpfulness.

[https://atom.io/packages/minimap][https_atom.io_packages_minimap]

![atom minimap][]

## [\#project-manager][project-manager] ##

`Alt + Shift + P`

Easy access and management to all your projects. Allows for project specific settings and options.

[https://atom.io/packages/project-manager][https_atom.io_packages_project-manager]

![atom project-manager][]

## [\#highlight-selected][highlight-selected] ##

When you double click a word, it and every other matching word in the file becomes highlighted.

[https://atom.io/packages/highlight-selected][https_atom.io_packages_highlight-selected]

![atom highlight-selected][]

## [\#simple-drag-drop-text][simple-drag-drop-text] ##

Highlight text to drag n' drop it somewhere else in your file.

[https://atom.io/packages/simple-drag-drop-text][https_atom.io_packages_simple-drag-drop-text]

![atom simple-drag-drop-text][]

## [\#Best Plugins][Best Plugins] ##

The following plugins are what I feel makes Atom's already great feature set, amazing. I use these in my day to day work to increase productivity.

## [\#git-plus][git-plus] ##

`Ctrl + Shift + H`

Shortcuts to common git actions without needing to switch to your terminal.

[https://atom.io/packages/git-plus][https_atom.io_packages_git-plus]

![atom git-plus][]

## [\#vim-mode][vim-mode] ##

Provides most of Vim's features to Atom blending the two together. Large portions of Vim have been reproduced but is still being added to.

[https://atom.io/packages/vim-mode][https_atom.io_packages_vim-mode]

## [\#merge-conflicts][merge-conflicts] ##

A very helpful tool for finding, previewing, and resolving merge conflicts within your project.

[https://atom.io/packages/merge-conflicts][https_atom.io_packages_merge-conflicts]

![atom merge-conflicts][]

## [\#color-picker][color-picker] ##

When a color is detected and the color picker is activated a very helpful window opens that lets you

[https://atom.io/packages/color-picker][https_atom.io_packages_color-picker]

![atom color-picker][]

## [\#emmet][emmet] ##

`tab`

A personal favorite because it saves so much time typing when building out pages. Just give it some hints about the html you want made and it will expand that into true html.

[https://atom.io/packages/emmet][https_atom.io_packages_emmet]

![atom emmet][]

## [\#docblockr][docblockr] ##

Makes writing documentation faster by detecting the details of the function below it and autofilling much of the comment.

[https://atom.io/packages/docblockr][https_atom.io_packages_docblockr]

![atom dockblockr][]

## [\#pigments][pigments] ##

Detects and displays colors behind the representative text so you don't have to remember what color a number is.

[https://atom.io/packages/pigments][https_atom.io_packages_pigments]

![atom pigments][]

## [\#linter][linter] ##

Probably one of the most helpful packages made, this visualizes and notifies you of errors within your project. Be sure to install all relevant linters so it can detect errors for you using eslint, phplint, or etc.

[https://atom.io/packages/linter][https_atom.io_packages_linter]

![atom linter][]

## [\#autocomplete-modules][autocomplete-modules] ##

Autocompletes require/import statements for you by following the path you type and showing you the available files at that location.

[https://atom.io/packages/autocomplete-modules][https_atom.io_packages_autocomplete-modules]

![atom autocomplete-modules][]

## [\#auto-update-packages][auto-update-packages] ##

Updates your packages automatically by checking for updates at the interval defined in it's settings.

[https://atom.io/packages/auto-update-packages][https_atom.io_packages_auto-update-packages]

![atom auto-update-packages][]

## [\#custom-title][custom-title] ##

Lets you set the template for Atom's title bar letting you show the relevant information about your current project, git, and file.

Here's the template I use:

<%= projectName %> <% if (relativeFilePath) { %>- <%= relativeFilePath %> <% } %> - <%= gitHead %>

[https://atom.io/packages/custom-title][https_atom.io_packages_custom-title]

![atom custom-title][]

## [\#file-icons][file-icons] ##

Pretty and good for visual grepping, these filetype icons appear next to files in your filetree, fuzzy finder, and tabs. You have the choice of colored or monochrome icons.

[https://atom.io/packages/file-icons][https_atom.io_packages_file-icons]

![atom file-icons][]

## [\#Conclusion][Conclusion] ##

My personal must-have/favorite is git-plus because the shortcuts it provides have clearly made me more productive.

If you'd like to browse what Atom has to offer checkout[Atom Packages][] for helpful plugins and [Atom Themes][Atom Packages] for any themes or color schemes you want.

If you'd like to try out my personal setup for Atom:

1.  Install the [config-import-export][] package to Atom.
2.  Create an `AtomBackups` in your home directory.
3.  [Download this JSON file to your AtomBackups Directory.][]
4.  Click Packages -> Config Import Export -> Import and select the freshly downloaded JSON file.

Recommended font replacements for Operator Mono:

*  [https://github.com/chrissimpkins/Hack][https_github.com_chrissimpkins_Hack]
 *  [https://github.com/tonsky/FiraCode][https_github.com_tonsky_FiraCode]

What's are your favorite packages for Atom?

From： https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text

[Introduction]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#introduction
[Atom]: https://atom.io/
[Atom Packages]: https://atom.io/packages
[Why Atom]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#why-atom
[Features]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#features
[can be found on their website]: https://atom.io/users/atom
[Fuzzy Finder]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#fuzzy-finder
[atom fuzzy finder]: https://cdn.scotch.io/1298/rFAduEfITT2QOjZYhouG_rangersteve_-_master.png
[Tree View]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#tree-view
[atom tree view]: https://cdn.scotch.io/1298/Y5hDRPdtQqW6T4dx6qI2_Screen%20Shot%202016-05-10%20at%207.34.34%20AM.png
[Package Installer]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#package-installer
[atom package installer]: https://cdn.scotch.io/1298/yZuljSOgRsq8RHd738FS_rangersteve_-_master.png
[Best Settings]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#best-settings
[atom settings]: https://cdn.scotch.io/1298/DVOgBVPkReajrfU3qKMk_rangersteve_-_master.png
[atom settings 1]: https://cdn.scotch.io/1298/QemgXYTyRaiqJ5mBwWfk_rangersteve_-_master.png
[Plugins to Make Atom Act Like Sublime Text]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#plugins-to-make-atom-act-like-sublime-text
[minimap]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#minimap
[Code Glance]: https://atom.io/packages/minimap-codeglance
[Linter]: https://atom.io/packages/minimap-linter
[https_atom.io_packages_minimap]: https://atom.io/packages/minimap
[atom minimap]: https://cdn.scotch.io/1298/MZWLfnwxRDashhi04hPH_rangersteve_-_resources_assets_js_ui_containers_GameUiContainer_js_-_master.png
[project-manager]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#projectmanager
[https_atom.io_packages_project-manager]: https://atom.io/packages/project-manager
[atom project-manager]: https://cdn.scotch.io/1298/1I8vcHksQVSGmElgRbW9_rangersteve_-_resources_assets_js_ui_containers_GameUiContainer_js_-_master.png
[highlight-selected]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#highlightselected
[https_atom.io_packages_highlight-selected]: https://atom.io/packages/highlight-selected
[atom highlight-selected]: https://cdn.scotch.io/1298/y5PZasESDq5jGfoFhuGp_rangersteve_-_resources_assets_js_ui_containers_GameUiContainer_js_-_master.png
[simple-drag-drop-text]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#simpledragdroptext
[https_atom.io_packages_simple-drag-drop-text]: https://atom.io/packages/simple-drag-drop-text
[atom simple-drag-drop-text]: https://cdn.scotch.io/1298/IXIWFIxBTeWHm3Om9a7Z_select-and-drag.gif
[Best Plugins]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#best-plugins
[git-plus]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#gitplus
[https_atom.io_packages_git-plus]: https://atom.io/packages/git-plus
[atom git-plus]: https://cdn.scotch.io/1298/6BFZtR62SNUKwshEPFcP_git-plus.gif
[vim-mode]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#vimmode
[https_atom.io_packages_vim-mode]: https://atom.io/packages/vim-mode
[merge-conflicts]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#mergeconflicts
[https_atom.io_packages_merge-conflicts]: https://atom.io/packages/merge-conflicts
[atom merge-conflicts]: https://cdn.scotch.io/1298/XugiSQxSfKD9PrWpmJvw_68747470733a2f2f7261772e6769746875622e636f6d2f736d61736877696c736f6e2f6d657267652d636f6e666c696374732f6d61737465722f646f63732f636f6e666c6963742d7265736f6c7574696f6e2e676966.gif
[color-picker]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#colorpicker
[https_atom.io_packages_color-picker]: https://atom.io/packages/color-picker
[atom color-picker]: https://cdn.scotch.io/1298/jF8DXzQrRySBL2E2WJGU_68747470733a2f2f6769746875622e636f6d2f74686f6d61736c696e647374726f6d2f636f6c6f722d7069636b65722f7261772f6d61737465722f707265766965772e676966.gif
[emmet]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#emmet
[https_atom.io_packages_emmet]: https://atom.io/packages/emmet
[atom emmet]: https://cdn.scotch.io/1298/4HwByEsURUCsC0voxhMh_emmet.gif
[docblockr]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#docblockr
[https_atom.io_packages_docblockr]: https://atom.io/packages/docblockr
[atom dockblockr]: https://cdn.scotch.io/1298/6nk5qJRXSsiIOKsZyz3U_docblockr.gif
[pigments]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#pigments
[https_atom.io_packages_pigments]: https://atom.io/packages/pigments
[atom pigments]: https://cdn.scotch.io/1298/iHNCvPRNSdSLa7NUREmr_rangersteve_-_______Desktop_color_scss_-_master.png
[linter]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#linter
[https_atom.io_packages_linter]: https://atom.io/packages/linter
[atom linter]: https://cdn.scotch.io/1298/0F75v4xQVu8RbnKkhlKQ_rangersteve_-_resources_assets_js_ui_components_Settings_ChooseSecondaryMenu_js_-_master.png
[autocomplete-modules]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#autocompletemodules
[https_atom.io_packages_autocomplete-modules]: https://atom.io/packages/autocomplete-modules
[atom autocomplete-modules]: https://cdn.scotch.io/1298/Ns1HI84KR7KGozkjR0PR_autocomplete-modules.gif
[auto-update-packages]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#autoupdatepackages
[https_atom.io_packages_auto-update-packages]: https://atom.io/packages/auto-update-packages
[atom auto-update-packages]: https://cdn.scotch.io/1298/Wm4Xj3HWT3CEIGQfkBLQ_68747470733a2f2f662e636c6f75642e6769746875622e636f6d2f6173736574732f38333635362f323532313537392f63333064346232612d623461632d313165332d383938612d3563373633653961316335612e706e67%20%281%29.png
[custom-title]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#customtitle
[https_atom.io_packages_custom-title]: https://atom.io/packages/custom-title
[atom custom-title]: https://cdn.scotch.io/1298/RCihFWBKSXuUXluIlcOI_rangersteve_-_resources_assets_js_ui_components_Settings_SettingsModal_js_-_master.png
[file-icons]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#fileicons
[https_atom.io_packages_file-icons]: https://atom.io/packages/file-icons
[atom file-icons]: https://cdn.scotch.io/1298/gdgVgQnR8CcfYqg8Oi0Y_rangersteve_-_app_js_-_master.png
[Conclusion]: https://scotch.io/bar-talk/best-of-atom-features-plugins-acting-like-sublime-text#conclusion
[config-import-export]: https://atom.io/packages/config-import-export
[Download this JSON file to your AtomBackups Directory.]: https://gist.githubusercontent.com/michaeljcalkins/2ac9028683f0eaf8a6fa6950a23869b1/raw/b06f3fd1767e841a4467a1c0c4f62e07a33a9678/import.json
[https_github.com_chrissimpkins_Hack]: https://github.com/chrissimpkins/Hack
[https_github.com_tonsky_FiraCode]: https://github.com/tonsky/FiraCode