Quasar i18n example app (quasar-i18n-example)

An app for demonstration of i18n (Internationalization and localization) in Quasar Framework.

Please contribute more language translations!

Demo

Demo app

Relevant documentation

• Quasar Language Packs
• App Internationalization (I18n)
• RTL Support
• Best practice for presenting languages
• International and multilingual sites

Integration with existing project

• Add Vue-i18n support

  Follow Quasar's App Internationalization documentation. TL;DR:

  • Setup i18n
  • Build default translation file
    • Create default translation file, src/i18n/en-us (rename according to your project's default local, as defined in quasar.conf.js, in framework.lang field)
  • Replace existing strings with $t() macros

• Copy the i18n.config.js file to your project and configure it to your preferences

• Set default project language in quasar.conf.js

• Optionally: Enable the Cookies plugin, for persistency of language selection

• Add language selection logic

  • If you plan to use the LanguageSelect component:

    • Copy the LanguageSelectMixin.vue and LanguageSelect.vue files to your project
    • Add the select component anywhere in your layout

  • Otherwise:

    • Copy the LanguageSelectMixin.vue file to your project
    • Use the mixin in your layout

• Edit the webpackInclude comment in LanguageSelectMixin.vue according to your desired languages

Install the dependencies

yarn

Start the app in development mode (hot-code reloading, error reporting, etc.)

quasar dev

Lint the files

yarn run lint

Build the app for production

quasar build

Customize the configuration

See Configuring quasar.conf.js.