title: custom transition classes don't work on Vue.js
body: <p>I'm trying to use some transition in my code using Vue.js with Tailwinds. My environment include Laravel Jetstream with Inertia that comes with vue.</p>
  <p>I notices that using this form everything work:
  <div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;transition name="some-name"&gt;
    &lt;div v-if="something"&gt;&lt;/div&gt;
   &lt;/transition&gt;
   
   </code></pre>
  </div>
  </div>
  </p>
  <p>and this classes in my CSS:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.some-name-enter {
    transform: translateX(-100%);
  }
  .some-name-leave-to {
    transform: translateX(-100%);
  }
  .some-name-leave-active,
  .some-name-enter-active {
    transition: all 0.5s ease-in-out;
  }</code></pre>
  </div>
  </div>
  </p>
  <p>but when i try to use this sintax:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;transition           
    enter-active-class="transition ease-out duration-100 transform"
    enter-from-class="opacity-0 scale-95"
    enter-to-class="opacity-100 scale-100"
    leave-active-class="transition ease-in duration-75 transform"
    leave-from-class="opacity-100 scale-100"
    leave-to-class="opacity-0 scale-95"
  &gt;
    &lt;div v-if="something"&gt;&lt;/div&gt;
  &lt;/transition&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>it is not working.. i just would like to use tailwind classes for the transition, they are very easy to use and there is no need to write lots of rows of css.</p>
  <p>i dont know if it is important but i am using vue 2.6.12. thanks in advance for your help.</p>