Skip to content
This repository has been archived by the owner on Mar 13, 2023. It is now read-only.

Missing support for .vue files #364

Closed
cor opened this issue Dec 1, 2015 · 25 comments
Closed

Missing support for .vue files #364

cor opened this issue Dec 1, 2015 · 25 comments

Comments

@cor
Copy link

cor commented Dec 1, 2015

Please add support for .vue files

--- Want to back this issue? **[Post a bounty on it!](https://www.bountysource.com/issues/28747938-missing-support-for-vue-files?utm_campaign=plugin&utm_content=tracker%2F535900&utm_medium=issues&utm_source=github)** We accept bounties via [Bountysource](https://www.bountysource.com/?utm_campaign=plugin&utm_content=tracker%2F535900&utm_medium=issues&utm_source=github).
@joshuajohnson814
Copy link

+1

@rootman
Copy link

rootman commented Feb 8, 2016

+1 ;)

@ghost
Copy link

ghost commented Feb 14, 2016

Yes, it would be great!

@sergeche
Copy link
Member

@joshuajohnson814
Copy link

Adding the following to my keymap.cson did the trick

'atom-text-editor[data-grammar~="vue"]:not([mini])':
    'tab': 'emmet:expand-abbreviation-with-tab'

@zhang6464
Copy link

@joshuajohnson814 I added this, and worked well for html expanding, while failed for css in style tag,
e.g
<style media="screen" lang="less">
.passenger-statu {
w10 // => <w10></w10>
}
</style>

@sqal
Copy link

sqal commented Apr 30, 2016

@joshuajohnson814 Thank you, that works in vue template tag, but now emmet also expands in script tag so when i type log and hit tab, it expands to <log></log> instead of console.log(). Can I somehow prevent this behavior?

someFile.vue

<template>
...
</template>

<script>
...
</script>

@clessg
Copy link

clessg commented Jun 14, 2016

This would be appreciated. For now I'm just using ctrl-e instead of tab.

@ednilsonamaral
Copy link

@joshuajohnson814 thanks, man. That works for me!

@rayfranco
Copy link

When using @joshuajohnson814 solution with a <style lang="stylus"> it seems that Emmet interpret the scope as normal css. But these are the scopes returned by Atom:

  • text.html.vue
  • source.stylus.embedded.html

So I guess that Emmet is interpreting the whole document as html and take what is inside the <style> tag as CSS instead of looking for it's proper scope. It should be the same behavior with any other preprocessors.
There is no fix for this with the settings, this should be updated in the core of emmet-atom to read embedded scopes instead of interpreting it by itself.

Does that makes sense @sergeche?

@Achieve777
Copy link

Achieve777 commented Nov 24, 2016

It didn't work well with using your method, neither ctrl+b or tab

@sergeche
Copy link
Member

Working on a new Emmet implementation, will fix that in new version

@JanlyH
Copy link

JanlyH commented Feb 15, 2017

@joshuajohnson814 Thank you!

@DiederikvandenB
Copy link

Any news on this :)? I am waaaaay too used to using tab to suddenly start using ctrl + e.

@chenwenxian
Copy link

language-vue-component. Adds syntax highlighting to Vue Component files in Atom.

@sergeche
Copy link
Member

Check out upcoming new Atom plugin with Emmet 2 onboard, seems like Vue works fine there: https://github.com/emmetio/atom-plugin

@chenwenxian
Copy link

Very good!

@daphen
Copy link

daphen commented Sep 14, 2017

Is it possible to get the fuzzy search and tab to expand?
'atom-text-editor:not([mini])': 'tab': 'emmet:expand-abbreviation-with-tab'
Does nothing with this plugin.
Stylus works in vue-files now though, so that's good.
I would want it to instantly expand, without a drop down, like, if I write oh and then expand, I'll get a dropdown where I can choose overflow: hidden and if I pick it, it will paste and hidden will be selected, so I have to manually deselect it before going to a new line where as before I would oh tab, overflow hidden is pasted and I instantly enter to go down a line. I see the point of this but it's not my personal preference.

@sergeche
Copy link
Member

@daphen The behaviour of tab expander (including expanding without completions) will be tuned later. There could be problems for users who don’t want to expand Emmet but insert tab instead

@daphen
Copy link

daphen commented Sep 14, 2017

@sergeche I see, cool, and it's not possible to set that up manually right away?

@sergeche
Copy link
Member

@daphen not yet, sorry. Still no dedicated command to expand abbreviation by handle, only via autocomplete popup

@daphen
Copy link

daphen commented Sep 14, 2017

@sergeche Alright, do you have an EST? Ballpark?

@sergeche
Copy link
Member

@daphen not yet, doing this project on my spare time, very busy at my job

@daphen
Copy link

daphen commented Sep 14, 2017

@sergeche Ah, I see. Best of luck then.

@JsonHunt
Copy link

JsonHunt commented Jan 10, 2021

For me replacing .source.vue with .text.html.vue (in snippets.cson file) did the trick

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests