How to apply prettier for selection

[it6]

How to configure prettier to work on selection when there is a selection in the buffer, or else apply to the whole file?

[Nick McCurdy]

Some Emacs packages allow automatic filtering by region when the mark is active. However, because Prettier is a full AST parser, I'm not sure it would be possible for Prettier itself for Prettier to format only part of a file because a region may not always have a completely valid JS AST, it might only be a child of a valid AST.

[it6]

I agree, but most of the time I change small portion of a file and don't want to reformat entire file. If there is a selection which would form a valid AST, please consider letting the user format only the selection. May be a flag to enable this behavior.

[Nick McCurdy]

Since prettier can take string inputs instead of files, we could try to limit formatting to the region if it's defined and cancel formatting if the region doesn't have a valid AST.

[it6]

Please consider a fix for this, I consistently run into this limitation.

[Roman Coedo]

We don't support it because in most cases selections are not valid AST. If you really want this you could use or copy the code from this branch, which has the prettier-js-prettify-region function.

[Bob Myers]

There are scenarios related to literate programming where this would be useful. If the fragment cannot be parsed, then could you not just return an error, which is what it does anyway now when the file is not parseable.

[Victor Rodrigues]

I seems that prettier range options could be used? https://prettier.io/docs/en/options.html#range

[Matej Duracka]

If anyone still cares >= 2020, I found the shell-command-on-region to be handy (https://www.masteringemacs.org/article/executing-shell-commands-emacs).

Here's a short and naive implementation of formatting an Org-mode code block (my Emacs Fu isn't great, but it shouldn't be a lot of work to change it to format current selection).

(defun format-js-org-code-block ()
  "Use Prettier to format a JavaScript Org-mode code block."
  (interactive)
  (shell-command-on-region
   (code-block-start)
   (code-block-end)
   "prettier --parser babel"
   (current-buffer)
   t))

(defun code-block-start ()
  "Find the beginning of code block."
  (goto-char (search-backward "#+BEGIN_SRC"))
  (next-line)
  (beginning-of-line)
  (point))

(defun code-block-end ()
  "Find the end of code block."
  (goto-char (search-forward "#+END_SRC"))
  (previous-line)
  (end-of-line)
  (point))

[jackschu]

Thanks @watofundefined here's what I ended up putting together for future onlookers :)

(defun prettier-region (posBegin posEnd)
  "Print number of words and chars in region."
  (interactive "r")
  (message "Formatting …")
  (let* (
         (old-prettier-args prettier-js-args)
         (prettier-js-args (append old-prettier-args 
                                                 (list "--range-start" (number-to-string posBegin) 
                                                        "--range-end" (number-to-string posEnd))))
         )
    (prettier-js)
    )
  )