Emacs for Javascript
- 介紹 Emacs 作為 Javascript 編輯器的套件支援
Youtube 影片
Emacs for Javascript
- js2-mode
- syntax highlight and checking
- can add js2-refactor
- tide mode
- 支援 flycheck (例如 eslint)
- 支援 eldoc
- 支援 company
- Jump to definition
- refactor
- prettier-js
- eslint 安裝
js2-mode 安裝
(use-package js2-mode :ensure t :mode (("\\.js\\'" . js2-mode) ("\\.json\\'" . javascript-mode)) :init (setq-default js2-basic-offset 2) (setq-default js2-global-externs '("module" "require" "assert" "setTimeout" "clearTimeout" "setInterval" "clearInterval" "location" "__d\ irname" "console" "JSON")))
tide-mode 安裝
(defun setup-tide-mode () (interactive) (tide-setup) (flycheck-mode +1) (setq flycheck-check-syntax-automatically '(save mode-enabled)) (eldoc-mode +1) (tide-hl-identifier-mode +1) ;; company is an optional dependency. You have to ;; install it separately via package-install ;; `M-x package-install [ret] company` (add-to-list (make-local-variable 'company-backends) 'company-files) (company-mode +1)) (add-hook 'js2-mode-hook #'setup-tide-mode) (use-package tide :ensure t :after (typescript-mode company flycheck) :hook ((typescript-mode . tide-setup) (typescript-mode . tide-hl-identifier-mode) (before-save . tide-format-before-save)))
prettier 安裝
- 先安裝 prettier
$sudo npm install -g prettier
- 安裝 emacs 套件
(use-package prettier-js :ensure t :hook ((js2-mode . prettier-js-mode)) :config (setq prettier-js-args '("--trailing-comma" "all" "--bracket-spacing" "false")))
eslint 安裝
- 安裝 eslint
$sudo npm install -g eslint
.eslintrc
# ~/.eslintrc { "extends": "eslint:recommended", "env": { "browser": true, "es6": true, "node": true }, "ecmaFeatures": { "arrowFunctions": true, "blockBindings": true, "classes": true, "defaultParams": true, "destructuring": true, "forOf": true, "generators": true, "modules": true, "spread": true, "templateStrings": true, "jsx": true }, "rules": { "semi": ["warn", "always"], "quotes": ["warn", "double"], "consistent-return": [0], "key-spacing": [0], "new-cap": [0], "no-multi-spaces": [0], "no-shadow": [0], "no-unused-vars": [1], "no-use-before-define": [2, "nofunc"] } }