title: How to import/use translation files based on locale
body: <p>So, I have a list of countries in three different languages as:    </p>
  
  <pre><code>countries-fr.js
  countries-en.js
  countries-de.js
  </code></pre>
  
  <p>I would like to require these files inside my component only based on the language selected. </p>
  
  <p>Currently I am doing: </p>
  
  <pre><code>&lt;template&gt;
  ...
  &lt;p v-for="country in countryList"&gt; {{ country.name }} &lt;/p&gt;
  ...
  &lt;/template&gt;
  
  &lt;script&gt;
  import {EN} from '../../countries-en.js'
  import {DE} from '../../countries-de.js'
  import {FR} from '../../countries-fr.js'
  
  export default {
    data () {
     EN, FR, DE
    },
  
    computed:  {
      countryList () {
        let lang = this.$store.state.user.lang
  
        if(lang == "EN"){return this.EN},
        if(lang == "FR"){return this.FR},
        if(lang == "DE"){return this.DE},
      }
    }
  }
  </code></pre>
  
  <p>This works obviously but I don't like I have to import the three files beforehand, and If I add 100 languages, then I will have to do that.</p>
  
  <p>So, my question is: how do I import a file based on the current locale? </p>
  
  <p>I could do if/else before the <code>&lt;script&gt;</code> and import but that doesn't seem the ideal way to import it. </p>