title: Globally-available mixin in VueJS
body: <p>I'm trying to create a mixin that's globally available, but not automatically injected into every component. i.e. i do NOT want this: <code>Vue.mixin({...});</code></p>
  
  <p>I set up the project according to <a href="https://github.com/vuejs/vue-cli" rel="noreferrer">these</a> instructions. <a href="http://vuejs-templates.github.io/webpack/structure.html" rel="noreferrer">This</a> is my project structure. I also have <code>assets/js/mixins.js</code> file in there containing my mixins. </p>
  
  <p>I would like to be able to do this in my individual .vue files (many of my components use <code>myMixin</code> but not all of them):</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;script&gt;
  export default {
      mixins:[myMixin],
      data:{....}
  }
  &lt;/script&gt;
  &lt;template&gt;
    &lt;!-- some template code --&gt;
  &lt;/template&gt;
  </code></pre>
  
  <p>So far the only way to do that is to add this line to the top of every component that needs it:</p>
  
  <pre class="lang-es6 prettyprint-override"><code>import {myMixin} from './assets/js/mixins.js"
  </code></pre>
  
  <p>but is there a way to do this once and have <code>myMixin</code> variable available globally? I've tried including it in <code>main.js</code> and in <code>app.vue</code> but I still get "myMixin is not defined" error if I try to use <code>myMixin</code> in any of the child components.</p>
  
  <p>Or is there another way to register a mixin that doesn't require me typing the path to the <code>mixins.js</code> file in each component?</p>