Nuxt Google Translate

Easily integrate Google Translate into your Nuxt 3 application with this powerful and customizable module.

Published: February 12, 2025

🌍 Easily integrate Google Translate into your Nuxt 3 application with this powerful and customizable module.

🌟 Features

  • 🌐 Seamless integration with Google Translate
  • 🚀 Easy to set up and use
  • 🎨 Customizable styling
  • 🤩 Support 100+ Languages
  • 🔧 Configurable default language and supported languages

🚀 Quick Start

Follow these steps to set up Nuxt Google Translate in your Nuxt project.

🔧 Prerequisites

  • Ensure you have Node.js and npm installed.
  • A Nuxt 3 project ready to go.

Installation Steps

  1. Install the Module
    Add the dependency to your project:
    npm install nuxt-google-translate
    
  2. Use the Component
    Add the <GoogleTranslate /> component to your app layout or app.vue:
    <template>
      <ClientOnly>
        <GoogleTranslate />       
      </ClientOnly>
    </template>
    

That's it! Your Nuxt app now supports multiple languages with Google Translate. 🎉

🎯 Usage

You can also use the <LanguageSelector /> component for a dropdown menu to switch languages:

<template>
  <div>
    <LanguageSelector />
  </div>
</template>

For more advanced configurations, check out the 📘 Full Documentation. 🚀

🤝 Contributing

We ❤️ contributions! Follow these steps to contribute:

  1. 🍴 Fork the repository
  2. 🌿 Create a new branch (git checkout -b feature/AmazingFeature)
  3. 💾 Commit your changes (git commit -m 'Add some AmazingFeature')
  4. 🚀 Push to the branch (git push origin feature/AmazingFeature)
  5. 🔃 Open a Pull Request

📄 License

This project is licensed under the MIT License.

🙏 Acknowledgements

  • Google Translate - For enabling seamless language translation.
  • Nuxt - For providing a powerful framework for building web applications.
  • The open-source community - For the amazing tools and contributions that make this module possible.

Made with ❤️ by the Nexos Creation Team

⭐ Star us on GitHub!