How to use ESLint Fixer in .vue:script

[ccforeverd]

atom-beautify/src/beautifiers/vue-beautifier.coffee

Line 31 in e0dc5c3

require("js-beautify")(text, options)

I have my javascript files beautified with atom-beautify by engine ESLint Fixer, and also want to beautify the script tag in vue template files with ESLint Fixer to make the same javascript format.

How can I use? It's there some simple way?

Sorry to disturb you!

PS. I'm poor in English...

[stevenzeck]

Can you provide sample code of what it looks like preformatted and what you expect?

[range3]

Hi, I can use ESLint Fixer engine in my .vue files so far, but in an ad hoc way...

1. Install eslint-plugin-vue to make .vue files eslintable
2. Configure atom-beautify.js.default_beautifier = "ESLint Fixer"
3. Open your .vue file and exec atom-beautify:beautify-language-javascript using Atom command palette

configure keymap.cson if you want

# beautify
'atom-text-editor':
  'ctrl-i': 'atom-beautify:beautify-editor'

# force use ESLint Fixer engine provided atom-beautify for js in .vue files
"atom-text-editor[data-grammar='text html vue']":
  'ctrl-i': 'atom-beautify:beautify-language-javascript'

[range3]

I created a pull request to add an option:

"*":
  "atom-beautify":
    vue:
      default_beautifier: "ESLint Fixer"

Could you please review this PR ? 😊

[Glavin001]

Published to v0.32.0