Begueradj   Archives  About

My Emacs issues and their solutions

Preamble

This article is going to be updated and become longer as the time goes on. I am listing the issues I stumbled upon and share how I fixed them as well as the solutions I gleaned here or there.

Set JS indentation to 2 in Vue.js and Nuxt.js

When developing with Vue.js or Nuxt.js, my JavaScript code indentation always works as if I set it to 4 spaces. I tried all sorts of solutions such as:

;; Set Javascript indentation to 2 spaces
(setq-default indent-tabs-mode nil)
(setq-default tab-width 2)

but none of them worked except this one I figured out some time ago by digging into the documentation:

;; Set Javascript indentation to 2 spaces
(setq js-indent-level 2)

How to set Eslint to auto-fix

This is an issue I encoutered when developing in Nuxt.js where Eslint always complains to me about mixing tabs and white spaces. It was tedious to me to go line by line to fix the indentation, before I landed on this sweat solution shared by a certain @ustun on Github:

;;; runs eslint --fix on the current file after save
;;; alpha quality -- use at your own risk

(defun eslint-fix-file ()
  (interactive)
  (message "eslint --fixing the file" (buffer-file-name))
  (shell-command (concat "eslint --fix " (buffer-file-name))))

(defun eslint-fix-file-and-revert ()
  (interactive)
  (eslint-fix-file)
  (revert-buffer t t))

(add-hook 'js2-mode-hook
          (lambda ()
            (add-hook 'after-save-hook #'eslint-fix-file-and-revert)))

Stop Eslint from preventing the use of console.log()

Whenever I wanted to debug my front-end code by using console.log(), Eslint complained about it and I could not run my code. There is a plugin that deals with it, but I did not try it since I found a simpler solution by digging into the documentation: I simply had to add "no-console": "off" to the rules by editing my ~/.eslintrc.json file:

{
    "parserOptions": {
        "ecmaVersion": 6,
        "sourceType": "module",
        "ecmaFeatures": {
            "jsx": true
        }
    },
    "rules": {
        "semi": 2,
        "no-console": "off"
    }
}

Written on Dec 10, 2018.