nuxt/website-v2

Doc examples on how to access publicRuntimeConfig from different places

Open

#1,535 opened on Jul 14, 2021

 (0 comments) (0 reactions) (0 assignees)Vue (1,135 forks)github user discovery
docshelp wanted

Repository metrics

Stars
 (2,240 stars)
PR merge metrics
 (No merged PRs in 30d)

Description

Is it possible to add examples on how to access publicRuntimeConfig values from the store or JS helper classes? I only found mentions that this is possible but no code examples on how to do this.

What i'm trying to do is to have a helper JS class for logging to application insights, and read the appInsightsInstrumentationKey from publicRuntimeConfig. Then I can just import it and have access to the logger, something like this.

nuxt.config.js

publicRuntimeConfig: {
    appInsightsInstrumentationKey : process.env.APP_INSIGHTS
  },

helper/logger.js

const client = new ApplicationInsights({
  config: {
    // instrumentationKey: process.env.APP_INSIGHTS, doesn't work
    // instrumentationKey: this.$config.appInsightsInstrumentationKey doesn't work
    // instrumentationKey: this.$context.appInsightsInstrumentationKey doesn't work
  }
});
client.loadAppInsights();

exports.info = async function (message, props) {
    client.trackTrace({ message: message, severity: SeverityLevel.Information });
}

home.vue

<script>
     const logger = require("../helper/logger");
      methods: {
            someAction(ev) {
                logger.info("action executed");
            }
      }
</script>

Also any help on how to do this will be welcomed, thanks!

Contributor guide