title: How to use .env variables in Nuxt 2 or 3?
body: <p>I have .env file in the project root, and in my nuxt config I am using variables to configure ReCaptcha like this:</p>
  <pre><code>import dotenv from 'dotenv'
  dotenv.config()
  
  export default {
      modules: [
          ['@nuxtjs/recaptcha', {
            siteKey: process.env.RECAPTCHA_SITE_KEY,
            version: 3,
            size: 'compact'
          }],
      ]
  }
  </code></pre>
  <p>and in .env like this:</p>
  <pre><code>RECAPTCHA_SITE_KEY=6L....
  </code></pre>
  <p>but the application always failed with console log error:</p>
  <blockquote>
  <p>ReCaptcha error: No key provided</p>
  </blockquote>
  <p>When I hard-code ReCaptcha key directly like that: <code>siteKey: 6L....</code> app start working, so I guess the problem is with reading .env props in nuxt.config</p>
  <p>do you have any idea how to fix it?</p>
  <p>EDIT:
  I tried update my nuxt.config by @kissu recommendation and by example which I found here: <a href="https://www.npmjs.com/package/@nuxtjs/recaptcha" rel="noreferrer">https://www.npmjs.com/package/@nuxtjs/recaptcha</a></p>
  <p>so there is new nuxt.config which also not working:</p>
  <pre><code>export default {
      modules: [
         '@nuxtjs/recaptcha',
      ],
      publicRuntimeConfig: {
         recaptcha: {
           siteKey: process.env.RECAPTCHA_SITE_KEY,
           version: 3,
           size: 'compact'
         }
    }
  }
  </code></pre>