Prettier


tips

run Prettier on all JS files

  1. https://github.com/prettier/prettier-vscode/issues/321#issuecomment-356171110
$ yarn run prettier --write "**/*.js"

or else add it as npm script:

  // package.json

  {
    "scripts": {
+     "prettier": "prettier --write '**/*.{js,css}'",
    },
  }

troubleshooting

MacVim generates *:p artifacts in project root directory

$ ls -al
...
-rw-r--r--    1 tap  staff    7598 Jul 19 15:14 11:p
-rw-r--r--    1 tap  staff    9643 Jul 19 15:14 9:p

they are generated sporadically - I haven’t found any pattern.

solution

most likely these are backup files generated by Vim and they have something to do with Prettier (because they appeared right after I started to use Prettier) but their file names are not expanded for some reason:

" ~/.vim/autocommands.vim

function! s:SetBackupDir()
  let l:backupdir = $HOME . '/.vim/backup/' . expand('%:p:h')
  " ...
endfunction

it may happen because 2 backup files are written to disk almost simultaneously:

my guess is Vim cannot handle this situation properly - hence the artifacts.

current (temporary) solution is to disable backups completely:

  " ~/.vim/vimrc

- set backup
+ set nobackup

UPDATE (2019-07-25)

artifacts are still generated even though Vim backups are disabled.

UPDATE (2019-08-15)

these artifacts are generated by any ALE fixer (ALE - ale Vim plugin). I’ve found these artifacts in Elixir project which uses ALE and mix_format fixer.

Prettier breaks formatting of Markdown tables without a header

tables without a header:

tables without a header (with <!-- prettier-ignore --> comment):

solution

see Markdown - Style Guide for details.