mirror of
https://github.com/atom/atom.git
synced 2026-01-25 06:48:28 -05:00
294 lines
9.0 KiB
Markdown
294 lines
9.0 KiB
Markdown
# Configuring Atom
|
|
|
|
Atom provides a globally-available configuration database that both the core
|
|
system and extensions look to for user- and language-specific settings. A simple
|
|
use of the database is to set things like your font-size and whether you want
|
|
Atom to hide files ignored by Git. You can assign these settings by editing
|
|
`config.cson` in your `.atom` directory:
|
|
|
|
```coffeescript
|
|
core:
|
|
hideGitIgnoredFiles: true
|
|
editor:
|
|
fontSize: 18
|
|
```
|
|
|
|
## Writing Config Settings
|
|
|
|
As shown above, the config database is automatically populated from `config.cson`
|
|
when Atom is started, but you can programmatically write to it in the following
|
|
way:
|
|
|
|
```coffeescript
|
|
# basic key update
|
|
config.set("editor.autosave", true)
|
|
|
|
config.get("fuzzyFinder.ignoredPaths").push "vendor"
|
|
config.update() # be sure to call `config.update` after the change
|
|
```
|
|
|
|
See the [configuration key reference]() for information on specific keys you
|
|
can use to change Atom's behavior.
|
|
|
|
## Reading Config Settings
|
|
|
|
You can read a value from `config` with `config.get`:
|
|
|
|
```coffeescript
|
|
# read a value with `config.get`
|
|
@autosave() if config.get "editor.autosave"
|
|
```
|
|
|
|
Or you can use `observeConfig` to track changes from a view object.
|
|
|
|
```coffeescript
|
|
class MyView extends View
|
|
initialize: ->
|
|
@observeConfig 'editor.lineHeight', => @adjust()
|
|
```
|
|
|
|
The `observeConfig` method will call the given callback immediately with the
|
|
current value for the specified key path, and it will also call it in the future
|
|
whenever the value of that key path changes.
|
|
|
|
Subscriptions made with `observeConfig` are automatically cancelled when the
|
|
view is removed. You can cancel config subscriptions manually via the
|
|
`unobserveConfig` method.
|
|
|
|
```coffeescript
|
|
view1.unobserveConfig() # unobserve all properties
|
|
view2.unobserveConfig("editor.lineHeight") # unobserve a specific property
|
|
```
|
|
|
|
You can add the ability to observe config values to non-view classes by
|
|
extending their prototype with the `ConfigObserver` mixin:
|
|
|
|
```coffeescript
|
|
ConfigObserver = require 'config-observer'
|
|
_.extend MyClass.prototype, ConfigObserver
|
|
```
|
|
|
|
## Scoped Config Settings
|
|
|
|
Users and extension authors can provide language-specific behavior by employing
|
|
*scoped configuration keys*. By associating key values with a specific scope,
|
|
you can make Atom behave differently in different contexts. For example, if you
|
|
want Atom to auto-indent pasted text in some languages but not others, you can
|
|
give the `autoIndentPastedText` key a different value under a scope selector:
|
|
|
|
```coffeescript
|
|
# in config.cson
|
|
editor:
|
|
autoIndentPastedText: true
|
|
scopes:
|
|
".source.coffee":
|
|
editor:
|
|
autoIndentPastedText: false
|
|
```
|
|
|
|
Scope selectors are placed under the `scope` key at the top-level of the
|
|
configuration file. The values you specify for keys under a selector will
|
|
override global values in that specific scope. Any basic CSS 3 selector is
|
|
permitted, but you should leave out element names to make your keys accessible
|
|
outside the view layer.
|
|
|
|
### Reading Scoped Config Settings
|
|
|
|
Use the `config.inScope` method to the read keys with the most specific selector
|
|
match:
|
|
|
|
```coffeescript
|
|
scope = [".source.coffee", ".meta.class.instance.constructor"]
|
|
config.inScope(scope).get "editor.lineComment"
|
|
```
|
|
|
|
Pass `.inScope` an array of scope descriptors, which describes a specific
|
|
element. This is frequently useful when you get the nested scopes for a position
|
|
in the buffer based on its syntax. You can also pass an actual DOM element
|
|
to use its nesting within the DOM as fodder for the scope selectors (†).
|
|
|
|
```coffeescript
|
|
config.inScope(fuzzyFinder.miniEditor).get("editor.fontSize")
|
|
```
|
|
|
|
`observeConfig` can take a scope as its first argument:
|
|
|
|
```
|
|
@observeConfig scope, "editor.autoIndentPastedText", -> # ...
|
|
```
|
|
|
|
†: Matching DOM elements fits cleanly into this scheme, but I can't think of a
|
|
use for it currently. Let's keep it in the back of our minds though.
|
|
|
|
# Themes
|
|
|
|
## Selecting A Theme
|
|
|
|
Because Atom themes are based on CSS, it's possible to have multiple themes
|
|
active at the same time. For example, you might select a theme for the UI, and
|
|
another theme for syntax highlighting. You select your theme(s) in the core
|
|
preferences pane, by selecting themes from the available list and dragging them
|
|
in your preferred order. You can also edit the selected themes manually with the
|
|
`config.core.themes` array.
|
|
|
|
## Installing A Theme
|
|
|
|
You install themes by placing them in the `~/.atom/themes` directory. The most
|
|
basic theme is just a `.css` or `.less` file. More complex occupy their own
|
|
folder, which can contain multiple stylesheets along with an optional
|
|
`package.json` file with a manifest to control their load-order:
|
|
|
|
```text
|
|
~/.atom/themes/
|
|
midnight.less
|
|
rockstar.css
|
|
rainbow/
|
|
package.json
|
|
core.less
|
|
editor.less
|
|
tree-view.less
|
|
```
|
|
|
|
package.json:
|
|
```json
|
|
{
|
|
"stylesheets": ["core", "editor", "tree-view"]
|
|
}
|
|
```
|
|
|
|
The package.json specifies which stylesheets to load and in what order with the
|
|
`stylesheets` key. If no manifest is specified, all stylesheets are loaded in
|
|
alphabetical order when the user selects the theme.
|
|
|
|
## Authoring A Theme
|
|
|
|
If you understand CSS, you can write an Atom theme easily. Your theme can style
|
|
Atom's user interface, specify the appearance of syntax-highlighted code, or
|
|
both. For making a syntax highlighting theme, refer to [section 12.4 of the
|
|
TextMate Manual](http://manual.macromates.com/en/language_grammars.html) for a
|
|
list of the common scopes used by TextMate grammars. You'll just need to
|
|
scope names to CSS classes. To theme Atom's user interface, refer to
|
|
[Classnames for Extension and Theme Authors]() for information about the CSS
|
|
classes used in Atom's core and the most common classes employed by
|
|
extensions.
|
|
|
|
## Theme Extensions
|
|
|
|
A theme will often cover the stock features of Atom, but may need to be extended
|
|
to cover extensions that weren't covered by its original author. Theme extensions
|
|
make this easy to organize. To make a theme extension, just add a theme that
|
|
matches the name of the original with an additional filename extension:
|
|
|
|
```text
|
|
~/.atom/themes/
|
|
midnight.less
|
|
midnight.terminal.less
|
|
midnight.tree-view.less
|
|
```
|
|
|
|
In the example above, when the `midnight` theme is loaded, its `terminal` and
|
|
`tree-view` extensions will be loaded with it. If you author a theme extension,
|
|
consider sending its author a pull request to have it included in the theme's
|
|
core.
|
|
|
|
## TextMate Compatibility
|
|
|
|
If you place a TextMate theme (either `.tmTheme` or `.plist`) in the `themes`
|
|
directory, it will automatically be translated from TextMate's format to CSS
|
|
so it works with Atom. There are a few slight differences between TextMate's
|
|
semantics and those of stylesheets, but they should be negligible in practice.
|
|
|
|
|
|
# Extensions
|
|
|
|
## Installing Extensions
|
|
|
|
To install an extension, clone it into the `~/.atom/extensions` directory.
|
|
If you want to disable an extension without removing it from the extensions
|
|
directory, insert its name into `config.core.disabledExtensions`:
|
|
|
|
config.cson:
|
|
```coffeescript
|
|
core:
|
|
disabledExtensions: [
|
|
"fuzzy-finder",
|
|
"tree-view"
|
|
]
|
|
```
|
|
|
|
## Writing Extensions
|
|
|
|
An extension can bundle a variety of different resource types to change Atom's
|
|
behavior. The basic extension layout is as follows (not every extension will
|
|
have all of these directories):
|
|
|
|
```text
|
|
my-extension/
|
|
lib/
|
|
config/
|
|
stylesheets/
|
|
keymaps/
|
|
snippets/
|
|
grammars/
|
|
package.json
|
|
index.coffee
|
|
```
|
|
|
|
### Source Code
|
|
|
|
Extensions can contain arbitrary CoffeeScript code. Place an `index.coffee` file
|
|
in the extension directory, or specify a `main` key in the extension's optional
|
|
`package.json` file. Place the bulk of your code in the extension's `lib`
|
|
directory, and require it from `index.coffee`.
|
|
|
|
```text
|
|
my-extension/
|
|
lib/
|
|
my-extension.coffee
|
|
rocket.coffee
|
|
package.json # optional
|
|
index.coffee
|
|
```
|
|
### Config Settings:
|
|
|
|
### Stylesheets
|
|
|
|
### Keymaps
|
|
|
|
Keymaps (with the `.keymap` extension) can be placed at the root of the
|
|
extension or in the `keymaps` subdirectory. By default, all keymaps will be
|
|
loaded in alphabetical order unless there is a `keymaps` array in `package.json`
|
|
specifying which keymaps to load and in what order. It's a good idea to provide
|
|
default keymaps for your extension. They can be customized by users later. See
|
|
the [main keymaps documentation]() for more information.
|
|
|
|
### Snippets
|
|
|
|
An extension can supply snippets in a `snippets` directory as `.cson` or `.json`
|
|
files:
|
|
|
|
```coffeescript
|
|
".source.coffee .specs":
|
|
"Expect":
|
|
prefix: "ex"
|
|
body: "expect($1).to$2"
|
|
"Describe":
|
|
prefix: "de"
|
|
body: """
|
|
describe "${1:description}", ->
|
|
${2:body}
|
|
"""
|
|
```
|
|
|
|
A snippets file contains scope selectors at its top level. Each scope selector
|
|
contains a hash of snippets keyed by their name. Each snippet specifies a `prefix`
|
|
and a `body` key.
|
|
|
|
All files in the directory will be automatically loaded, unless the
|
|
`package.json` supplies a `snippets` key as a manifest. As with all scoped items,
|
|
snippets loaded later take precedence over earlier snippets when two snippets
|
|
match a scope with the same specificity.
|
|
|
|
### Grammars
|
|
|
|
## TextMate Compatibility |