Enabling a company backend for a specific mode was a tedious tasks with code scattered at different locations, one for local variable definitions, one for company hook function definitions and another where the backends were pushed to the local variables (which was problematic, since we ended up pushing the same backends over and over again with `SPC f e R`, pushes have been replaced by add-to-list calls in the new macro). All these steps are now put together at one place with the new macro spacemacs|add-company-backends, check its docstring for more info on its arguments. This macro also allows to define arbitrary buffer local variables to tune company for specific modes (similar to layer variables via a keyword :variables) The code related to company backends management has been moved to the auto-completion layer in the funcs.el file. A nice side effect of this move is that it enforces correct encapsulation of company backends related code. We can now easily detect if there is some configuration leakage when the auto-completion layer is not used. But we loose macro expansion at file loading time (not sue it is a big concern though). The function spacemacs|enable-auto-complete was never used so it has been deleted which led to the deletion of the now empty file core-auto-completion.el. The example in LAYERS.org regarding auto-completion is now out of date and has been deleted. An example to setup auto-completion is provided in the README.org file of the auto-completion layer. |
||
---|---|---|
.. | ||
img | ||
config.el | ||
funcs.el | ||
packages.el | ||
README.org |
TypeScript layer
Description
This layer adds support for TypeScript and TSX editing.
This layer provides:
- Eldoc-mode
- Documentation at point
- Auto complete
- Flycheck with linter
- Jump to definition, Jump to type definition
- Find occurrences (Imenu-mode)
- Rename symbol
- tsx mode
- formatting
- TypeScript playground integration
Install
Pre-requisites
You will need node.js v0.12.0
or greater
If you want linting run: npm install -g typescript
npm install -g tslint
If you want to use typescript-formatter for formatting run: npm install -g typescript-formatter
For best results, make sure that the auto-completion
(company) and html
layers are enabled.
Layer
To use this configuration layer, add it to your ~/.spacemacs
. You will need to
add typescript
to the existing dotspacemacs-configuration-layers
list in this
file.
(setq-default dotspacemacs-configuration-layers '(typescript))
If you need formatting on save:
(setq-default dotspacemacs-configuration-layers '(
(typescript :variables
typescript-fmt-on-save t)))
You can choose formatting tool:
(setq-default dotspacemacs-configuration-layers '(
(typescript :variables
typescript-fmt-tool 'typescript-formatter)))
Default is 'tide .
Notes
This layer uses:
- tide
- flycheck
- typescript-formatter - optional.
The tools use configuration files. You can learn more in their documentation.
Make sure to add tsconfig.json in the project root folder.
tsserver mangles output sometimes issue - #2758, which will result in json parse error. Try node version 0.12.x if you get this error.
Send to playground requires browser.
Currently tsserver doesn't pickup tsconfig.json file changes. You might need to restart server after editing it.
Key bindings
Typescript Major Mode
Key Binding | Description |
---|---|
SPC m = |
reformat the buffer |
SPC m g b |
jump back |
SPC m g g |
jump to entity's definition |
SPC m g t |
jump to entity's type definition |
SPC m g u |
references |
SPC m h h |
documentation at point |
SPC m r r |
rename symbol |
SPC m s p |
send selected region or current buffer to the web playground |
SPC m S r |
restart server |
Reference Major Mode
Key Binding | Description |
---|---|
C-j |
find previous reference |
C-k |
find next reference |
C-l |
goto reference |