Intellisense and auto-completion in SFC components separate into 3 files

[legarsjules]

• I have searched through existing issues
• I have read through docs
• I have read FAQ

Suggestion

In a project .vue SFC files are splitted into 3 separate files (template (.html), script (.ts), style (.scss)). The intellisense and auto completion don't work with this configuration. Would it be possible to add this feature?

[yoyo930021]

We can't support this part.
If you don't use vue file, There's nothing we can actually do.

[seanogdev]

@yoyo930021 Curious, what are the limitations by this design? In the Vue docs its outlined as a valid scenario for people (or organisations).

Is it more difficult to parse the JS files from the .vue file that exists, rather than it just being rendered in the editor?

[yoyo930021]

@yoyo930021 Curious, what are the limitations by this design? In the Vue docs its outlined as a valid scenario for people (or organisations).

Is it more difficult to parse the JS files from the .vue file that exists, rather than it just being rendered in the editor?

This is the editor limit.
#1444 (comment)

[yoyo930021]

Personally,
You can use separate file in script and style.
The script file need to add Vue.extends or defineComponent on export default.
The template write in Vue SFC.
So you have a chance to enjoy most of the feature.

[seanogdev]

Apologies if i'm not understanding correctly, to clarify, if we manually change the exports of the JS files to do the following:

import Vue from 'vue';

export default Vue.extend({ 
 // vue component logic
})

We should get the autocomplete features of this extension? I've just tried it and it still doesnt seem to get picked up unfortunately.

Just for context: I'm working at a company that decided early on in the process of migrating / developing in Vue to split all of our files in to 3 distinct files (vue, js, scss). Anything that would help improved the development experience here would be great.

Great work so far though :)

[yoyo930021]

Apologies if i'm not understanding correctly, to clarify, if we manually change the exports of the JS files to do the following:

import Vue from 'vue';

export default Vue.extend({ 
 // vue component logic
})

We should get the autocomplete features of this extension? I've just tried it and it still doesnt seem to get picked up unfortunately.

Just for context: I'm working at a company that decided early on in the process of migrating / developing in Vue to split all of our files in to 3 distinct files (vue, js, scss). Anything that would help improved the development experience here would be great.

Great work so far though :)

You can't get full autocomplete features of this extension.
But you can get typescript autocomplete in ts file, and this is about 60% of the functionality.

If you try to get template Interpolation support when <script src="xxx"> in vue file, It is a feature request.

[askeet]

Is it still in progress ? Still looking for a good plugin for spiting of vue files
Because it doesn't see any variable or functions between .html and .vue with script tag