Skip to content

Instantly share code, notes, and snippets.

@SjB

SjB/vue-mode-polymode.el

Created February 7, 2021 03:23
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save SjB/07cdce0f1fba171704d93c2989077f4d to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save SjB/07cdce0f1fba171704d93c2989077f4d to your computer and use it in GitHub Desktop.
Download ZIP
Raw
vue-mode-polymode.el
(use-package polymode
:ensure t
:defer t
:hook (vue-mode . lsp-deferred)
:mode ("\\.vue\\'" . vue-mode)
:config
(define-innermode poly-vue-template-innermode
:mode 'html-mode
:head-matcher "^<[[:space:]]*\\(?:template\\)[[:space:]]*>"
:tail-matcher "^</[[:space:]]*\\(?:template\\)[[:space:]]*>"
:head-mode 'host
:tail-mode 'host)
(define-innermode poly-vue-script-innermode
:mode 'js-mode
:head-matcher "<[[:space:]]*\\(?:script\\)[[:space:]]*>"
:tail-matcher "</[[:space:]]*\\(?:script\\)[[:space:]]*>"
:head-mode 'host
:tail-mode 'host)
(define-auto-innermode poly-vue-template-tag-lang-innermode
:head-matcher "^<[[:space:]]*\\(?:template\\)[[:space:]]*lang=[[:space:]]*[\"'][[:space:]]*[[:alpha:]]+[[:space:]]*[\"'][[:space:]]*>"
:tail-matcher "^</[[:space:]]*\\(?:template\\)[[:space:]]*>"
:mode-matcher (cons "^<[[:space:]]*\\(?:template\\)[[:space:]]*lang=[[:space:]]*[\"'][[:space:]]*\\([[:alpha:]]+\\)[[:space:]]*[\"'][[:space:]]*>" 1)
:head-mode 'host
:tail-mode 'host)
(define-auto-innermode poly-vue-script-tag-lang-innermode
:head-matcher "<[[:space:]]*\\(?:script\\)[[:space:]]*lang=[[:space:]]*[\"'][[:space:]]*[[:alpha:]]+[[:space:]]*[\"'][[:space:]]*>"
:tail-matcher "</[[:space:]]*\\(?:script\\)[[:space:]]*>"
:mode-matcher (cons "<[[:space:]]*\\(?:script\\)[[:space:]]*lang=[[:space:]]*[\"'][[:space:]]*\\([[:alpha:]]+\\)[[:space:]]*[\"'][[:space:]]*>" 1)
:head-mode 'host
:tail-mode 'host)
(define-auto-innermode poly-vue-style-tag-lang-innermode
:head-matcher "<[[:space:]]*\\(?:style\\)\\(?:scoped\\|[[:space:]]\\)*lang=[[:space:]]*[\"'][[:space:]]*[[:alpha:]]+[[:space:]]*[\"']*\\(?:scoped\\|[[:space:]]\\)*>"
:tail-matcher "</[[:space:]]*\\(?:style\\)[[:space:]]*>"
:mode-matcher (cons "<[[:space:]]*\\(?:style\\)\\(?:scoped\\|[[:space:]]\\)*lang=[[:space:]]*[\"'][[:space:]]*\\([[:alpha:]]+\\)[[:space:]]*[\"']\\(?:scoped\\|[[:space:]]\\)*>" 1)
:head-mode 'host
:tail-mode 'host)
(define-innermode poly-vue-style-innermode
:mode 'css-mode
:head-matcher "<[[:space:]]*\\(?:style\\)[[:space:]]*\\(?:scoped\\|[[:space:]]\\)*>"
:tail-matcher "</[[:space:]]*\\(?:style\\)[[:space:]]*>"
:head-mode 'host
:tail-mode 'host)
(define-polymode vue-mode
:hostmode 'poly-sgml-hostmode
:innermodes '(
poly-vue-template-tag-lang-innermode
poly-vue-script-tag-lang-innermode
poly-vue-style-tag-lang-innermode
poly-vue-template-innermode
poly-vue-script-innermode
poly-vue-style-innermode
)))
@noor-tg
Copy link

noor-tg commented Mar 24, 2022 •
edited
Loading

does this config still work ?

  • does it support lsp ?
    • typescript lsp ?
    • volar lsp ?
  • what about eslint error check ?
  • company autocompletions ?
  • template block ?
    • error handle ?
    • components autocomplete and import ?

if it is not working . is there any replacement to develop vue apps with emacs ?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment