Problem with vue files

[victorwpbastos]

With this package installed the .vue files are rendered like this:

[JoshuaWise]

What language does it display in the very bottom right of Sublime Text?

[victorwpbastos]

It shows Vue Component.

[JoshuaWise]

I can't reproduce the problem you're having. Could you copy-and-paste the entire file here for me to test it?

[victorwpbastos]

Ok. Remember to install the Vue Syntax Highlight package.

<template>
    <div v-if="user">
        <h2>{{ user }}</h2>
    </div>
</template>

<script>
    export default {
        data() {
            return {
                user: 'Admin'
            }
        }
    }
</script>

<style scoped>
    h2 {
        color: red;
    }
</style>

[icepole-jon]

@victorwpbastos, @JoshuaWise Did you have any method to deal with this? thx a lot

[victorwpbastos]

@icepole-jon, for now, I disabled the plugin.

[alexbet]

+1. I have Vue Syntax Highlight installed, but I am getting all of those red blocks too. Any way that this can get fixed? I disabled the package for now.

[alexbet]

Enabling the "Javascript" package that this package disables solves the red blocks problem. But, it seems like Sublime needs a few seconds before it can render a Vue file on boot. I will uninstall this package until this problem has been resolved.

[franciscolourenco]

Same issue here.

[franciscolourenco]

With the default Javascript package installed: text.html.vue for <template></template> text.html.vue source.js.embedded.html for <script></script> text.html.vue source.css.embedded.html for <style></style>

[franciscolourenco]

For anyone interested, babel-sublime is working fine with .vue files, after disabling the default Javascript package.

[JoshuaWise]

The problem seems to be caused by the Vue Component syntax not using the proper way of embedding other syntaxes (javascript). I'll see if I can create a PR on their repo to get it fixed.