New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[Not a bug] How could I get rjsx-mode to newline and indent when I'm in between tags? #108
Comments
Seems like I managed to bring this functionality from (when (featurep! :lang javascript)
(setq-default js-indent-level 2)
(when (featurep! :lang web)
;; Web mode tag expansion in rjsx
(after! rjsx-mode
(defun ~+javascript-rjsx-mode-h ()
(require 'web-mode)
(setq web-mode-markup-indent-offset 2)
(add-hook 'after-change-functions 'web-mode-on-after-change nil t)
(add-hook 'post-command-hook 'web-mode-on-post-command nil t))
(setq ~+javascript-rjsx-do-web-mode-indent nil)
(defun ~+javascript-rjsx-newline-and-indent-a ()
(when (derived-mode-p 'rjsx-mode)
(setq ~+javascript-rjsx-do-web-mode-indent t)))
(defun ~+javascript-rjsx-indent-line-a ()
(when (and (derived-mode-p 'rjsx-mode)
~+javascript-rjsx-do-web-mode-indent)
(web-mode-indent-line)
(setq ~+javascript-rjsx-do-web-mode-indent nil)))
(advice-add 'newline-and-indent :before #'~+javascript-rjsx-newline-and-indent-a)
(advice-add 'rjsx-indent-line :before #'~+javascript-rjsx-indent-line-a)
(add-hook 'rjsx-mode-hook #'~+javascript-rjsx-mode-h)))) |
Seems like a very heavyweight solution. Here's what electric-pair does in case you want to adapt. (Check out
(when (and (if (functionp electric-pair-open-newline-between-pairs)
(funcall electric-pair-open-newline-between-pairs)
electric-pair-open-newline-between-pairs)
(eq last-command-event ?\n)
(< (1+ (point-min)) (point) (point-max))
(eq (save-excursion
(skip-chars-backward "\t\s")
(char-before (1- (point))))
(matching-paren (char-after))))
(save-excursion (newline 1 t))) |
For some reason this doesn't work at all. Even |
For those that want a quick fix that just works similarly to (defun tag-expand ()
(interactive)
(if (and
(looking-at "[ \t]*<")
(looking-back ">[ \t]*"))
(progn (newline-and-indent)
(save-excursion (newline-and-indent))
(indent-according-to-mode))
(newline-and-indent)))
(add-hook 'rjsx-mode-hook (lambda () (local-set-key (kbd "RET") 'tag-expand))) |
When you press RET between
{}
it does the following (where|
is the cursor):How can I get rjsx-mode to do the same with html/react component tags
RET
The text was updated successfully, but these errors were encountered: