Сергей delphinpro

<TermsConfirm
  :by="`clicking '${name}'`"
>

<div v-for="(league, index) in leagues.countrys"
     v-if="league.strFanart1"
>
    <h3>{{ league.strLeague }}</h3>
    <h5>{{ league.strFanart1 }}</h5>
</div>

computed: {
    leagues() {
      return this.$store.state.leagues.filter(item => !!item.strFanart1);
    }
},

@font-face {
  font-family: 'Geometria';
  src: local('Geometria Thin'), local('Geometria-Thin'),
    url('~@/assets/fonts/geometria/Geometria-Thin.woff2') format('woff2'),
    url('~@/assets/fonts/geometria/Geometria-Thin.woff') format('woff');
  font-weight: 100;
  font-style: normal;
}

Должен же быть какой-то просто аналог $(this).add/removeClass('active').

this.el.classList.add('active')
this.el.classList.remove('active')

import '@/styles/main.scss';
import Vue from 'vue';
//...

@import "base/normalize";
@import "base/init";
@import "base/typography";
@import "base/code";
@import "base/links";
@import "base/tables";
@import "base/buttons";
@import "base/control-group";
@import "base/general-form";
@import "parts/transitions";
...

$NODE_ENV: development;
@import "cfg-vars";

$NODE_ENV: production;
@import "cfg-vars";

$DEV_MODE: $NODE_ENV == development;
$MAX_INT32: 2147483647;

@import "cfg-vrhythm";
@import "cfg-grid";
@import "../../../node_modules/vrhythm/source/vrhythm";
@import "../../../node_modules/bs-grid-system/source/scss/bs-grid";
@import "../mixins";
@import "cfg-z-indexes";

$wt-family-base: "Open Sans", sans-serif;
$wt-family-head: "Roboto Slab", serif;
$font-family-monospace:  "Fira Code", Menlo, Monaco, Consolas, "Courier New", monospace;

//==
//== Color palette
//== ======================================= ==//

$palette-light-blue: #3c8dbc; // Primary
$palette-red       : #dd4b39; // Danger
$palette-green     : #00a65a; // Success
$palette-aqua      : #00c0ef; // Info
$palette-yellow    : #f39c12; // Warning

...

const NODE_ENV = process.env.NODE_ENV === 'development'
    ? 'development'
    : 'production';
//...
module.exports = {
    //...
    css: {
        extract: NODE_ENV === 'production',
        loaderOptions: {
            sass: {
                data: `@import "@/styles/config/env-${NODE_ENV}.scss";`,
            },
        },
    },
};

{
    ...
    chainWebpack: config => {
        config.plugins.delete('prefetch');
        config.plugins.delete('preload');
    },
    ...
}

"use strict";var _createClass=function(){function e(e,i){for(var t=0;t<i.length;t++){var n=i[t];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}return function(i,t,n){return t&&e(i.prototype,t),n&&e(i,n),i}}();function _classCallCheck(e,i){if(!(e instanceof i))throw new TypeError("Cannot call a class as a function")}var VShowSlide=function(){function e(){_classCallCheck(this,e),this.easingOptions={builtIn:["linear","ease","ease-in","ease-out","ease-in-out"],custom:{}}}return _createClass(e,[{key:"install",value:function(e,i){this.validateOptions(i),e.directive("show-slide",{bind:this.bind.bind(this),inserted:this.inserted.bind(this),componentUpdated:this.componentUpdated.bind(this)})}},{key:"bind",value:function(e,i){this.parseArgs(e,i)}},{key:"inserted",value:function(e,i){this.initializeTarget(e,i.value)}},{key:"componentUpdated",value:function(e,i){this.toggleSlide(e,i)}},{key:"validateOptions",value:function(e){void 0!==e&&e.hasOwnProperty("customEasing")&&(this.easingOptions.custom=e.customEasing)}},{key:"kebabToCamel",value:function(e){return e.replace(/-([a-z])/g,function(e){return e[1].toUpperCase()})}},{key:"parseArgs",value:function(e,i){if(i.hasOwnProperty("arg")){var t=i.arg.split(":");this.validateEasing(e,t),this.validateDuration(e,t)}else e.duration=300,e.durationInSeconds="0.3s",e.easing="ease"}},{key:"validateEasing",value:function(e,i){i.hasOwnProperty(1)?this.easingOptions.builtIn.includes(i[1])?e.easing=i[1]:this.easingOptions.custom.hasOwnProperty(this.kebabToCamel(i[1]))?e.easing=this.easingOptions.custom[this.kebabToCamel(i[1])]:e.easing="ease":e.easing="ease"}},{key:"validateDuration",value:function(e,i){e.duration=i.hasOwnProperty(0)?parseInt(i[0]):300,e.durationInSeconds=e.duration/1e3+"s"}},{key:"initializeTarget",value:function(e,i){i||(e.style.height="0px"),e.style.overflow="hidden",e.style.transition="height "+e.easing+" "+e.durationInSeconds}},{key:"toggleSlide",value:function(e,i){i.value!==i.oldValue&&(i.value?this.slideOpen(e):this.slideClosed(e))}},{key:"slideOpen",value:function(e){e.isAnimating&&clearTimeout(e.timeout),e.isAnimating=!0;var i=e.scrollHeight;e.style.height=i+"px",e.timeout=setTimeout(function(){e.style.height="auto",e.isAnimating=!1},e.duration)}},{key:"slideClosed",value:function(e){e.isAnimating&&clearTimeout(e.timeout),e.isAnimating=!0;var i=e.scrollHeight;e.style.height=i+"px",setTimeout(function(){e.style.height="0px"},25),e.timeout=setTimeout(function(){e.isAnimating=!1},e.duration)}}]),e}(),vShowSlide=new VShowSlide;

Vue.use(vShowSlide, {
  customEasing: {
    exampleEasing: 'cubic-bezier(0.68, -0.55, 0.265, 1.55)'
  }
});

new Vue({
    el: '#app1',
    //...
});
new Vue({
    el: '#app2',
    //...
});
new Vue({
    el: '#app3',
    //...
});

css: {
    loaderOptions: {
        sass: {
            data: `@import "@/styles/config/env-production.scss";`,
        },
    },
},

<v-tabs v-model="active">
  <v-tab v-for="n in 3" :key="n">Item {{ n }}</v-tab>
  <v-tab-item v-for="n in 3" :key="n">
      Любое содержимое 
  </v-tab-item>
</v-tabs>

data: function(){
  return {
    tabList: [
      {caption: 'Вкладка 1', content: '<h1>Содержимое первой вкладки</h1>'},
      {caption: 'Вкладка 2', content: '<h1>Содержимое второй вкладки</h1>'},
      {caption: 'Вкладка 3', content: '<h1>Содержимое третьей вкладки</h1>'},
    ]
  }
}

<v-tab v-for="(tab, index) in tabList" :key="index">Item {{ tab.caption }}</v-tab>
<v-tab-item v-for="(tab, index) in tabList" :key="index">
  <div v-html="tab.content"></div>
</v-tab-item>

<v-tab :key="1">Tab 1</v-tab>
<v-tab :key="2">Tab 2</v-tab>

<v-tab-item :key="1">Содержимое вкладки 1</v-tab-item>
<v-tab-item :key="2">Содержимое вкладки 2</v-tab-item>

if(this.type == 'password') this.type = 'text'
        else this.type = 'password'

<app-icon-heart/>
<app-icon-like/>

<script type="text/javascript">
  window.__STATE__ = <?= json_encode($allData) ?>;
</script>

created () {
  if (window.__STATE__ && window.__STATE__.myData) {
    this.myData = window.__STATE__.myData;
  } else {
    axios.get( .... )
  }
}