Newrelic's node agent has a requirement that it's the first line of your main module in order to properly bootstrap. https://docs.newrelic.com/docs/agents/nodejs-agent/installation-configuration/install-nodejs-agent#installing
Currently there's no way to do this in Nuxt's setup.
There may also be other use-cases outside of analytics modules, but I can't think of any right now.
Support some way of requiring modules as the first line of the main js entrypoint, perhaps from a hook or something that will be injected in the build step? I would provide code examples but I'm not that familiar with Nuxt internals yet.
Hi. I suggest 3 approaches to try:
We can try to add import 'newrelic'
to the top of nuxt.config.js
? This should partially work as this is almost the topmost entry-point.
We may create a custom cli wrapper in the root of the project:
~/nuxt.js
:
require('newrelic')
require('nuxt/bin/nuxt')
````
And then inside `package.json`:
```diff
scripts: {
-- "start": "nuxt start",
++ "start": "node ./nuxt start",
}
If newrelic is similar to sentry, this is not required to be the first import, we can do this via a nuxt module and it globally should register itself to the entire process:
modules/newrelic.js
export default async function() {
await import('newrelic')
}
nuxt.config.js
export default {
modules: [
'~/modules/newrelic'
]
}
I'm interested in this as well, did you attempt anything @theomjones ?
Thanks
Hi @kezek, yeah we went with the CLI wrapper as new relic has to be the first required module for full metrics.
Thanks for the feedback. Do you also use PM2 by any chance ?
Yeah we do, we went by these docs: https://pm2.keymetrics.io/docs/usage/docker-pm2-nodejs/
I used the CLI wrapper and it works properly.
Sadly, it's not integrating with the router and all the transactions are shown as /GET
I was thinking of binding the name with the router (in a middleware maybe) but dind't have time to get my hands into it.
Has anyone faced that issue?
After some hassle, I managed to set it up.
I added newrelic as an external webpack dependency in nuxt.config.js
extend (config, ctx) {
config.externals = [
{ newrelic: 'newrelic' }
]
}
And then in nuxtServerInit I set the transaction name with code split so the bundle doesn't break in client side
async nuxtServerInit ({ dispatch, commit }, context) {
const newrelic = await import('newrelic')
newrelic.setTransactionName(context.route.matched[0].path)
}
@nachogarcia can you see the time cosuming at the external requests on newrelic site? I have the configuration just like yours, but can't see this info.
Yeah, they show. Although for some reason I can only see the details of the calls to my PIM, not to my CMS (probably something related to the infra). It looks like this:
@nachogarcia Hi, we tried your approach with implementing the two rows in 'nuxtServerInit' function to see the full path of Browser tracing names:
const newrelic = await import ('newrelic')
newrelic.SetTransactionName(context.route.matched[0].path)
We found out in our CI/CD process build, the script was broken every time when IIS physical path set to folder when we running the 'npm run build' script.
When we removed the two mentioned rows everything was running as well.
The error we get is:
ERROR in ./node_modules/newrelic/lib/system-info.js
Module not found: Error: Can't resolve 'child_process' in 'node_modulesnewreliclib'
Can you assists please?
Thank you,
SP
No idea. Did you set the external webpack dependency?
Also, I improved this a bit. There were some routes without match so now the line looks like
newrelic.setTransactionName(context.route.matched[0] ? context.route.matched[0].path : context.route.name)
And the GETs that didn't get logged were the calls to my healthcheck serverMiddleware so I added the env variable NEW_RELIC_IGNORING_RULES: '^/health'
We did set the external webpack dependency as you suggested. I would like to add that our NuxtJS app is running as a Windows service. We can't find a reason why the build fails to import newrelic in the nuxtServerInit. Do you have any other thoughts on that?
Thanks you for sharing your improvements. We'll try it once the above issue will be resolved.
Doing a quick search it seems like it's a rather common issue with other libraries. People fix it with
module.exports.node = {
child_process: 'empty'
}
Maybe you can go through that route, or you can open an issue in https://github.com/newrelic/node-newrelic
We tried child_process: 'false' and it didn't worked so I'm not sure if 'empty' will make a difference but I'll give it a shot.
Much appreciated.
@nachogarcia Hey! I've configured my newrelic as same as you did and its working fine, but on the client interactions, Im having this error:
logger.js?899e:6 Uncaught (in promise) TypeError: newrelic.noticeError is not a function
Do you have any idea of wahts possibly going on? thanks ;)
We're using it on nuxtServerInit with the dynamic import for using server side only :/
We're using it on nuxtServerInit with the dynamic import for using server side only :/
humm I get it. Thanks!
I would take a look at how we handle in the Sentry module as inspiration: https://github.com/nuxt-community/sentry-module/blob/master/lib/module.js#L60-L73
To test easily without having to write a module, you can directly use hooks directly in your nuxt.config.js
, example:
export default {
hooks: {
'render:errorMiddleware'(app) {
app.use((err, req, res, next) => {
// Catch the error with you error reported
console.error(`An error occured while rendering ${req.url}\n`, err)
// Let Nuxt show the error page
// You can customize the HTML error page for production by creating app/views/error.html
next(err)
})
}
}
}
Most helpful comment
Hi. I suggest 3 approaches to try:
1. Config
We can try to add
import 'newrelic'
to the top ofnuxt.config.js
? This should partially work as this is almost the topmost entry-point.2. CLI Wrapper
We may create a custom cli wrapper in the root of the project:
~/nuxt.js
:3. Module (best)
If newrelic is similar to sentry, this is not required to be the first import, we can do this via a nuxt module and it globally should register itself to the entire process:
modules/newrelic.js
nuxt.config.js