105 lines
3.1 KiB
Org Mode
105 lines
3.1 KiB
Org Mode
#+TITLE: TypeScript layer
|
|
|
|
[[file:img/TypeScript.png]]
|
|
|
|
* Table of Contents :TOC_4_gh:noexport:
|
|
- [[#description][Description]]
|
|
- [[#install][Install]]
|
|
- [[#pre-requisites][Pre-requisites]]
|
|
- [[#layer][Layer]]
|
|
- [[#notes][Notes]]
|
|
- [[#key-bindings][Key bindings]]
|
|
- [[#typescript-major-mode][Typescript Major Mode]]
|
|
- [[#reference-major-mode][Reference Major Mode]]
|
|
|
|
* Description
|
|
|
|
This layer adds support for TypeScript and TSX editing.
|
|
|
|
This layer provides:
|
|
- ElDoc
|
|
- Auto complete
|
|
- Flycheck
|
|
- Jump to definition, Jump to type definition
|
|
- Find occurrences
|
|
- Rename symbol
|
|
- Imenu
|
|
- linting
|
|
- tsx mode
|
|
- formatting
|
|
|
|
* 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 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.
|
|
|
|
#+BEGIN_SRC emacs-lisp
|
|
(setq-default dotspacemacs-configuration-layers '(typescript))
|
|
#+END_SRC
|
|
|
|
If you don't need linting, you can use:
|
|
|
|
#+BEGIN_SRC emacs-lisp
|
|
(setq-default dotspacemacs-configuration-layers '(
|
|
(typescript :variables
|
|
typescript-use-tslint nil)))
|
|
|
|
#+END_SRC
|
|
|
|
If you need formatting on save:
|
|
|
|
#+BEGIN_SRC emacs-lisp
|
|
(setq-default dotspacemacs-configuration-layers '(
|
|
(typescript :variables
|
|
typescript-fmt-on-save t)))
|
|
|
|
#+END_SRC
|
|
|
|
** Notes
|
|
|
|
This layer uses:
|
|
- [[https://github.com/ananthakumaran/tide][tide]]
|
|
- [[https://github.com/Simplify/flycheck-typescript-tslint][flycheck-typescript-tslint]]
|
|
- [[https://github.com/vvakame/typescript-formatter][typescript-formatter]]
|
|
*Those tools use configuration files. You can learn more in their documentations.*
|
|
|
|
Make sure to add [[https://github.com/Microsoft/TypeScript/wiki/tsconfig.json][tsconfig.json]] in the project root folder.
|
|
|
|
tsserver mangles output sometimes [[https://github.com/Microsoft/TypeScript/issues/2758][issue - #2758]], which will result in json parse error. Try node version 0.12.x if you get this error
|
|
|
|
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 r~ | restart server |
|
|
|
|
** Reference Major Mode
|
|
|
|
| Key Binding | Description |
|
|
|-------------+-------------------------|
|
|
| ~C-j~ | find previous reference |
|
|
| ~C-k~ | find next reference |
|
|
| ~C-l~ | goto reference |
|