title: Access i18n values from vuejs component
body: <p>I use i18n to provide multilingual support to an application, I'd like the charts I provide with highcharts to have the same behaviour.</p>
  <pre class="lang-html prettyprint-override"><code>&lt;i18n&gt;
  {
    &quot;fr&quot;: {
      &quot;test&quot;: &quot;en fançais&quot;
    },
    &quot;en&quot;: {
      &quot;test&quot;: &quot;in english&quot;
    } 
  }
  &lt;/i18n&gt;
  
  &lt;template&gt;
      &lt;highcharts :options=&quot;options&quot;&gt;&lt;/highcharts&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  import '@/plugins/highcharts.js'
  
  export default {
    data() {
      return {
        options: {
          chart: {
            type: 'bar'
          },
          series: [{
            name: $t('test'),
            data: [1.0, 0.3, 0],
            color: '#beab9d'
          }],
          xAxis: {
            categories: [&quot;1&quot;, &quot;2&quot;, &quot;3&quot;]
          }
        }
      }
    }
  }
  &lt;/script&gt;
  </code></pre>
  <p>But when building the application, I got :</p>
  <pre><code>'$t' is not defined
  </code></pre>
  <p>There is a way to access i18n values from the script part of a component ?</p>