huang-julien / nuxt-applicationinsights Goto Github PK

With the last version, if you provide a connection string to the module, Application Insights will fail to initialize.

The config provided to AppInsights is a Proxy and not a raw object, and AppInsights tries to set its own observer on the object and it fails. One way to fix it would be to use toRaw:

config: toRaw(runtimeConfig.public).applicationinsights ?? {}

I updated this module in 0.5.0 in my Nuxt 3 codebase and every access to the Runtime Config from my server side part are breaking and considered unknown when typechecking my project.

For example:

server/connectors/tenant/fr/auth.ts:41:7 - error TS2322: Type 'unknown' is not assignable to type 'string'.

41       client_secret: clientSecret,

Here is a small repro repository: https://github.com/Creatiwity/nuxt-appinsights-repro-fail

You can test it this way (with bun or npm):

bun install
bun run typecheck # will error

If you remove nuxt-applicationinsights from the modules list it will work.

Currently the configuration is split between:

• config.applicationInsights
• runtime config
• runtime hooks

We can probably remove the serverConfig and clientConfig from the moduleOptions to rely on the private and public runtime config.
We can also change the type of the public applicationinsihgts from Snippet to IConfiguration & IConfig.

The server side config would then fallback on runtimeConfig.public.applicationInsights.connectionString if the connection string isn't setup within the private runtime config

this is due to how nuxt work internally and may need a change upstream.

At nitro AfterResponse hook and in case of a nuxt error page, it is a path like /__nuxt_error?url=...statusCode=... because nuxt-nitro renderer does an internal localFetch to render the error page.

I keep getting the following error:

nuxt.js:94 [nuxt] error caught during app initialization 
Error: Please provide instrumentation key

I tried to add it as in @nuxtjs/applicationinsights (Nuxt2), but this seems to be ignored.

appInsights: {
    instrumentationKey: '' 
  }

I also tried to add it to the runtimeConfig

applicationinsights: {
        connectionString: ''
 }

Or add the env variables:

APPLICATIONINSIGHTS_CONNECTION_STRING= '' 
APPINSIGHTS_INSTRUMENTATION_KEY= ''
APPINSIGHTS_CONNECTION_STRING= ''

I couldn't find anything in the readme or in the files itself. Probably not a bug / error, but I can't figure out what to do.

Currently I do this

 $appInsights.trackPageView({ uri: basePath + currentRoute.fullPath });

This creates the Page View entry, but totally decouples them from the backend process.
In https://github.com/huang-julien/nitro-applicationinsights/blob/683f2ed0a3ab8c58b846bae0b2aeee8e674dde52/src/plugin.ts#L38C1-L38C1
we try to get the parentId from the headers and find the traceParent

It would be great if we could use that to add the page view to that Parent Trace

This issue lists Renovate updates and detected dependencies. Read the Dependency Dashboard docs to learn more.

Open

These updates have all been created already. Click a checkbox below to force a retry/rebase of any.

• fix(deps): update all non-major dependencies (@microsoft/applicationinsights-core-js, @microsoft/applicationinsights-web, @nuxt/eslint-config, @nuxt/module-builder, @nuxt/test-utils, @types/node, pnpm, vue-tsc)
• chore(deps): update dependency eslint to v9
• chore(deps): update dependency vitest to v2
• Click on this checkbox to rebase all open PRs at once

Detected dependencies

• Check this box to trigger a request for Renovate to run again on this repository

Hey @huang-julien,

Thanks for your work here!
I got here through an issue on the "old" Nuxt 2 solution.
Just dropping a quick note to check in on the project's status.
Is it considered finished, or are there ongoing updates in the pipeline?

I saw the blog post from Alex Lichter about how complex this is, so really trying not to sound pushy here ;)
Just wanted to find out if I can use this already.

Thanks!
Milan

Probably need a useApplicationInsights() composable since applicationinsights and @microsoft/ApplicationInsights-Web types are not compatible.

When nuxt-applicationinsights is installed, running nuxi typecheck will raise errors that the output of useRuntimeConfig() is unknown

Very easy to create a reproduction: just create a new Nuxt 3 project, and add this:

nuxt.config.ts:

  runtimeConfig: {
    public: {
      test: "",
    },
  },

app.vue:

<script setup lang="ts">
const config = useRuntimeConfig()

const test: string = config.public.test
</script>

This raises no error, but as soon as modules: ["nuxt-applicationinsights"], is added to nuxt.config.ts, an error appears saying that Type 'unknown' is not assignable to type 'string'.

with the fix from nitro-applicaitoninsights 0.9.2, initial request when an error happens will be correctly tracked. But both request (nuxt makes an internal localfetch to render the error page) will be in separated operation ids

Hey,

First thanks for maintaining this project!

We have added nuxt-applicationinsights in our project and if we look at the Application Insights we see a Application map which tells us that the connection is made correctly. But all the metrix in Performance and Failures stay empty. Our setup is the follwing:

• nuxt: 3.5.3
• SSR: true

modules: ['nuxt-applicationinsights'],
runtimeConfig: {
    public: {
      applicationinsights: {
        connectionString: 'InstrumentationKey=xxxxx;IngestionEndpoint=xxxxx;LiveEndpoint=xxxx;ApplicationId=xxxxx'
      }
    }
  },

Are we missing something here with the setup?

Thanks in advance!

Currently, if a connection string isn't specified, a full-page error is thrown rendering the application completely inoperable.

A module, esp for analytics, should never stop an application from rendering, IMO, it should fail silently.

I think it'd make a lot of sense to by default check if a connection string exists and if not, prevent the module from loading further, simply logging the reason to the console.

Hey, trying to install and check this out

nuxt: "^3.9.1"

after install and adding to modules, the project wont run or generate. First a warning:

WARN "/Users/joseph/Projects/xxxx/xxxx/xxxx/xxxx/node_modules/nuxt-applicationinsights/dist/runtime/server/plugins/setup.ts" is imported by "virtual:#internal/nitro/virtual/plugins", but could not be resolved – treating it as an external dependency.

Then an error:

ERROR Cannot find module '/Users/joseph/Projects/xxxx/xxxx/nuxt-applicationinsights/dist/runtime/server/plugins/setup.ts' imported from /Users/joseph/Projects/xxxx/xxxx/xxxx/xxxx/.nuxt/prerender/index.mjs

inspecting .nuxt/prerender/index.mjs shows:

...
import 'file:///Users/joseph/Projects/xxxx/xxxx/xxxx/xxxx/node_modules/unstorage/drivers/fs-lite.mjs';
import 'file:///Users/joseph/Projects/xxxx/xxxx/xxxx/xxxx/node_modules/radix3/dist/index.mjs';
import '../../../../nuxt-applicationinsights/dist/runtime/server/plugins/setup.ts';
import 'file:///Users/joseph/Projects/xxxx/xxxx/xxxx/xxxx/node_modules/nitro-applicationinsights/dist/index.mjs';

So that import path is incorrect, any ideas?