Тигран Абрамян

<div class="booking__step" v-if="CustomVoucherCount.length > 2">

<span v-if="ruleForm.isValid === false">
  Текст ошибки
</span>

ruleForm: {
  cars: [],
  isValid: null,
  carModels: {
    toyota: true,
    ferrari: false,
    suzuki: false,
    bmw: true
  }
}

validateCars(formName) {
  if (this.ruleForm.cars.length === 0) {
    this.ruleForm.isValid = false;
  } else {
    this.ruleForm.isValid = true;
    console.log('success');
  }
}

нужно все положить в один div

<div class="container pt-5" id="counter">
  <div class="card center">
    <h1> {{ counter }}</h1>
    <div>
      <button class="btn">+</button>
    </div>
  </div>
</div>

<button
  type="button"
  class="btn btn-upload"
  @click.prevent="$refs.uploadAvatar.click()"
>
  Загрузить
</button>

chooseShipOnBoard(index, square) {
   this.isShipHovered = index;
}

:class="{ hover: isShipHovered === index }"

https://9gag.com/
https://www.nintendo.com/
https://www.grammarly.com/

https://habr.com/en/company/ruvds/blog/470413/

template: `
  <div>
    <h3>{{title}}</h3>
    <p>{{text}}</p>
  </div>
 `

https://stackoverflow.com/questions/53705861/vuejs...

Правильно ли я понял?

sass-loader не работает с версией 8.0.0. и vue cli 3.10.0

Как уже всем известно scss новая версия sass так что придется новую версию sass'a использовать.

Вы конечно можете попробовать исправить эту проблему вписывая в vue.config.js эту штуку.

module.exports = {
  css: {
    loaderOptions: {
      sass: {
        prependData: ` @import '@/assets/sass/_theme.scss';`
      }
    }
  },
}

Или это.

Сначала все обновляем.

npm update -g @vue/cli
# OR
yarn global upgrade --latest @vue/cli

npm update sass-loader
# OR
yarn upgrade --latest sass-loader

module.exports = {
  css: {
    loaderOptions: {
      // old
      sass: {
        data: `@import "@/styles/_global.scss";`,
      },
      // new
      sass: {
        prependData: `@import "@/styles/_global.sass"`, // change to *.sass; remove semi-colon
      }, 
      scss: { // separate one for scss
        prependData: `@import "@/styles/_global.scss"`, // this is .scss
      }, 
    },
  },
  // ...
}

Или это.

module.exports = {
  css: {
    loaderOptions: {
      sass: {
        sassOptions: {
          includePaths: [
            './node_modules'
          ]
        },
        prependData: `@import "@/styles/global.scss";`,
      },
    },
  },
};

Не забудьте проверять все это в vue.config.js.

Если не сработает, то как уже сказал

sass-loader не работает с версией 8.0.0. и vue cli 3.10.0

Заходите в поисковик гугла, впихываете туда
github vuejs examples
ну вот и все
Пример, и заходите в любой попадаюшийся проект.

npm cache clean --force
rm -rf node_modules
npm install
npm run dev

Может стоит так импортировать?
import Vue from 'vue';

Вместо
window.Vue = require('vue')

https://vuejs.org/v2/guide/typescript.html

Куда можно вынести функцию, чтобы она была видна во всех компонентах без подключения?

С помощью миксинов.

<div id="app">
  <h1>Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestias, culpa!</h1>
  <router-view></router-view>
</div>

Или же ставьте router-view где вам нужно.

https://jsfiddle.net/ud6qn2j4/

<div id="app">
  <button @click="isShowText">click</button>
  <div class="documents" v-if="!isShow1">
    show 1
  </div>
  <div class="market" v-if="isShow2">
    show 2
  </div>
</div>

data: {
  isShow1: false,
  isShow2: false
},
methods: {
  isShowText() {
    this.isShow1 = !this.isShow1;
    this.isShow2 = !this.isShow2;
  }
}

<p @click="doSomething"><router-link to="/">Do Something</router-link><p>