Quasar i18n and Localazy



  • I saw a demo of Localazy here: https://vaclavhodek.com/how-to-localize-vuejs-app-with-vue-i18n-and-localazy and I LOVE the idea of outsourcing my localisation via an online portal so I thought I would check it out.

    I got everything working to a point, and before I contact Localazy - has anyone got their library working? From what I can see it is expecting a straight js file and so:

    {
      "helloworld": "Hello World!"
    }
    

    works but the default format for a quasar language file:

    export default {
      helloworld: "Hello World!"
    }
    

    Does not, and neither does the export have the correct header. I can use intermediate files of course (which is what I am doing for testing) but is there a more elegant way?



  • I have answered my own question: all that was required was to use the file type js instead of json and it works beautifully.

    Nice stuff!



  • @btmi

    That’s a great find! Could you explain what the (possible) extra steps are to integrate Localazy with Quasars i18n?



  • @dobbel It is really very easy.

    Follow the instructions here to set up internationalization
    https://quasar.dev/options/app-internationalization

    Sign up to the Localazy service to get your application keys

    Add the localazy.json file to the root of your app with content like this:

    {
    
      "writeKey": "[your write key]",
      "readKey": "[your read key]",
      
      "upload": {  
        "type": "js",
        "files": "src/i18n/en-us/index.js"
      },
      
      "download": {
        "files": "src/i18n/${lang}/index.js"
      }
      
    }
    

    (this is based on the folders created with the default i18n installation)

    then use the commands:

    localazy upload
    

    check your translations and

    localazy download
    

    It is as simple as that.



  • Actually I found a small issue with the output (the output files have quotes around the key values, even though they are not present in the source) and so I have asked the developers for clarification on how to resolve this.

    Apart from that, i think this is a brilliant idea, very well executed.



  • The authors came back and said that this behaviour was expected, and that the inclusion of the quotes makes no difference to the outcome, which may be right, but it does add to the payload and reduces readability so I will suggest that they include this as an option in the future.

    Now I have to find out how I can have multiple language files for each language, so I can have dynamic translations that need to be maintained by this program, and static translations (for things like country names) which do no change. Any ideas how I can have more that 1 js file in each language folder?


Log in to reply