Autocomplete less/SCSS variables in .vue files for cases with @import

• I have searched through existing issues

Feature Request

I am forced to use @import in the styles block. It would be nice to have auto-completion for variable names.

<template>
  <!-- some code -->
</template>

<script lang="ts">
  // some code
</script>

<style lang="less" scoped>
  @import '@/styles/variables.less'; // File with variables for autocomplete (Including @padding-lg)
  // or @import '../styles/variables.less'; 

  .selectorr {
    padding: @padding-lg; // It would be great to have autocomplete here when you type @
  }
</style>

[Smekalin]

I have the same problem. Even if I write relative path through ‘…/…/’ I cannot use auto-competion for variables. If I write separated ‘.less’ file I can use autocomplete. This problem only in SFC

[octref]

As mentioned, you can use the extension for now. I don’t have time to reimplement it for Vetur.