Get Started #

Prerequisite #

This project uses Google Identity Services Library under the hood. Its just bunch of helpers which allows you to develop Vue3 apps with google login 🚀

You need to configure a project in Google API Console and obtain a Client ID using the following 📝 guide from google.

Installation #

• With NPM

npm install -S vue3-google-signin

• With Yarn

yarn add vue3-google-signin

• With PNPM

pnpm add vue3-google-signin

Setup the Library #

Setting up the library is very simple. In your application entry point(main.js or main.ts) put the following code.

// rest of the code

import GoogleSignInPlugin from "vue3-google-signin"

app.use(GoogleSignInPlugin, {
  clientId: 'CLIENT ID OBTAINED FROM GOOGLE API CONSOLE',
});

// other config

app.mount("#app");

Now the library is ready to be used ✨

With Nuxt #

To easily use the library with Nuxt3 we have provided a module called nuxt-vue3-google-signin which take care of proper component registration and plugin initialization 🔥.

Add package #

• With NPM

npm install -S nuxt-vue3-google-signin

• With Yarn

yarn add nuxt-vue3-google-signin

• With PNPM

pnpm add nuxt-vue3-google-signin

Initialize #

Now you can add following entry to the nuxt.config.ts(or nuxt.config.js)

import { defineNuxtConfig } from 'nuxt/config'

export default defineNuxtConfig({
  modules: [
    'nuxt-vue3-google-signin'
  ],
  googleSignIn: {
    clientId: 'CLIENT ID OBTAINED FROM GOOGLE API CONSOLE',
  }
})