Vue.js Google Adsense is a Google Adsense Component that provides the support of InFeed and InArticle Ads in your web application. You can view the demo here.

What are In-Feed and In Article Ads?

At least there are three (3) type ads in Google Adsense:

• Responsive Ads: A simple way to get ads on your page. Choose the size, placement, and style you want to display.

• In Article Ads: Ads that fit seamlessly in between the paragraphs of your pages for an enhanced reading experience.

• In-Feed Ads: Ads that flow naturally inside a list of articles or products on your site, offering a great user experience.

Installation

You need dependencies vue-script2 , So you need to run this command for the installation:

npm install vue-script2 vue-google-adsense --save

Use in main.js

import Ads from 'vue-google-adsense'

Vue.use(require('vue-script2'))

Vue.use(Ads.Adsense)
Vue.use(Ads.InArticleAdsense)
Vue.use(Ads.InFeedAdsense)

Use partial import

Import only AdsType you need

import Adsense from 'vue-google-adsense/dist/Adsense.min.js'
import InArticleAdsense from 'vue-google-adsense/dist/InArticleAdsense.min.js'
import InFeedAdsense from 'vue-google-adsense/dist/InFeedAdsense.min.js'

Vue.use(require('vue-script2'))

Vue.use(Adsense)
Vue.use(InArticleAdsense)
Vue.use(InFeedAdsense)

Template

VueAdsense Template :

<Adsense
    data-ad-client="ca-pub-XXXXXXXXXXXXXXXX"
    data-ad-slot="1234567890">
</Adsense>

VueInArticleAdsense Template :

<InArticleAdsense
    data-ad-client="ca-pub-XXXXXXXXXXXXXXXX"
    data-ad-slot="1234567890">
</InArticleAdsense>

VueInFeedAdsense Template :

<InFeedAdsense
    data-ad-layout-key="-fg+5n+6t-e7+r"
    data-ad-client="ca-pub-XXXXXXXXXXXXXXXX"
    data-ad-slot="1234567890">
</InFeedAdsense>

Auto Ads Usage

import Vue from 'vue'
import Ads from 'vue-google-adsense'

Vue.use(require('vue-script2'))

Vue.use(Ads.AutoAdsense, { adClient: 'YOUR_GOOGLE_AD_CLIENT', isNewAdsCode: true })

This package has a lot of props that you can use easily. For more details, you can visit its documentation & source code on Github.