[Vuejs]-How to create a define for a single vue document?

I do not think there is anything exactly like what you want, But maybe this will help you:

<template>
 <div :style="myVars">{{ SOMETHING }}</div>
</template>

<script>
export default {
 data() {
   return { SOMETHING: 'red'}
 },
 computed: {
  myVars () {
    return{
      '--text-color': this.SOMETHING,
    }
  }
 }
<script>

<style scoped>
   div{
     color: var(--text-color);
   }
</style>