borela / naomi

Sublime Text enhanced syntax highlighting for JavaScript ES6/ES7/ES2015/ES2016/ES2017+, Babel, FlowType, React JSX, Styled Components, HTML5, SCSS3, PHP 7, phpDoc, PHPUnit, MQL4. Basic: Git config files.
Other
558 stars 18 forks source link

Vue Single File Components #125

Open 2Pacalypse- opened 6 years ago

2Pacalypse- commented 6 years ago

Are there any plans on adding support for Vue's single-file components?

Here's the documentation on them: https://vuejs.org/v2/guide/single-file-components.html

borela commented 6 years ago

I'll add the vue syntax in a couple of weeks, the official one is being rewritten but it is using features that only works in sublime's dev build. Already got a basic prototype on my machine.

faiwer commented 6 years ago

Hello, @borela. What do you think about syntax highlighting for vue-templates in .js (not .vue) files?

In sublimetext3: img_03_10_01_4efb6dd1882

In vscode (Vue Inline Template plugin + Vetur plugin): img_03_10_01_b441477e931

I'm not sure how to better detect that it's a vue-template. May be some special comment? Or just check template: \s*<opentag .* /closetag>\s*? I dunno. I think it'll be great!

borela commented 6 years ago

@faiwer I am thinking about detecting by the project's type and file location, that way I could also disable Jest's globals from normal files.

For my personal projects it will be easy as I developed a toolbox that has a explicit project type, detecting Jest's tests shouldn't be hard too, do you think it's possible to detect Vue by some config?

faiwer commented 6 years ago

I think that developer can explicitly set all required fields in sumblime project config. Something like:

naomi: {
  vue: { used: true, re: /src.*\.js$/ },
  jest: { used: true, re /.../ },
},