Nuxt.js怎么引用谷歌广告js代码

科技菌 2019-9-13 3871

    Nuxt.js引用谷歌广告的JS代码,只配置nuxt.config.js文件就可以!


    只需要添加我用中文注释的三段代码就可以了!


    // 这段是谷歌广告要引入的JS代码,这里装在一个字符串变量里xxxxx就是你的ID
    const absbygoogle = '(adsbygoogle=window.adsbygoogle||[]).push({google_ad_client:"ca-pub-xxxxx",enable_page_level_ads:true});';
    
    export default {
      mode: 'universal',
    
      /*
      ** Headers of the page
      */
      head: {
        meta: [
          {charset: 'UTF-8'},
          {name: 'viewport', content: 'width=device-width, initial-scale=1, shrink-to-fit=no'},
          {httpEquiv: 'Content-Type', content: 'text/html; charset=UTF-8'},
          {httpEquiv: 'content-language', content: 'zh-CN'}
        ],
        script: [
          // 这里引入谷歌广告的JS文件,async要为true
          {src: 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js', async: 'true'},
          // 把上面的JS代码变量引用到这里
          {innerHTML: absbygoogle, type: 'text/javascript', charset: 'utf-8'}
        ],
        // 禁止对JS转义,这一句一定要加上
        __dangerouslyDisableSanitizers: ['script']
      },
    
      /*
      ** Customize the progress-bar color
      */
      loading: '@/components/loading.vue',
    
      /*
      ** Global CSS
      */
      css: [
        '@/assets/common.css',
        '@/assets/icon/iconfont.css'
      ],
    
      /*
      ** Plugins to load before mounting the App
      */
      plugins: [
        '@/plugins/axios'
      ],
    
      /*
      ** Nuxt.js modules
      */
      modules: [
        // Doc: https://bootstrap-vue.js.org/docs/
        'bootstrap-vue/nuxt',
        '@nuxtjs/axios'
      ],
    
      /*
      ** Build configuration
      */
      build: {
        extractCSS: {allChunks: true},
        /*
        ** You can extend webpack config here
        */
        extend(config, ctx) {
        }
      }
    }


    推荐阅读
    1. 咖啡已成为很多人生活中不可或缺的一部分~顶刊「Science」上数据统计显示,全世界平均每天要消耗22.5亿杯咖啡,杯子连起来简直能绕地球7.5圈。虽然中国全国范围内的人均咖啡饮用杯数仅为9杯/年,但在一二线城
    2. 结直肠癌是美国第三大常见癌症,在过去二十年中,年轻人的发病率一直在上升。结直肠癌包含两种癌症:结肠癌和直肠癌,前者起病于大肠,后者起病于大肠的末端,称为直肠。  梅奥诊所胃肠病专家 Derek E
      梅奥诊所:结直肠癌的预防与筛查, 如何降低患结直肠癌风险
    最新评论 (0)

    Copyright © 2024 chuihu.com

    京ICP备15036784号-5

    T: 0.009, S: 14