Having troubles to install apm agent with Angular 6 app

I'm facing issues to install apm agent on my Angular 6 app.

I install the agent (npm install elastic-apm-node --save) and put in my main.ts the following code :

// Add this to the VERY top of the first file loaded in your app
declare var require: any //had to set this to avoid ERROR in src/main.ts(9,11): error TS2580: Cannot find name 'require'. Do you need to install type definitions for node? Try npm i @types/node.
var apm = require('elastic-apm-node').start({
// Override service name from package.json
// Allowed characters: a-z, A-Z, 0-9, -, _, and space
serviceName: '',

// Use if APM Server requires a token
secretToken: '',

// Set custom APM Server URL (default: http://localhost:8200)
serverUrl: ''
});

And got this error :

ERROR in ./node_modules/elastic-apm-node/lib/agent.js
Module not found: Error: Can't resolve '../package' in 'C:\Users\sivanq\Documents\BRGM SI SSP\ssp-frontend\ui\node_modules\elastic-apm-node\lib'
ERROR in ./node_modules/elastic-apm-node/lib/config.js
Module not found: Error: Can't resolve '../package' in 'C:\Users\sivanq\Documents\BRGM SI SSP\ssp-frontend\ui\node_modules\elastic-apm-node\lib'
ERROR in ./node_modules/elastic-apm-http-client/index.js
Module not found: Error: Can't resolve './package' in 'C:\Users\sivanq\Documents\BRGM SI SSP\ssp-frontend\ui\node_modules\elastic-apm-http-client'
ERROR in ./node_modules/elastic-apm-node/lib/instrumentation/async-hooks.js
Module not found: Error: Can't resolve 'async_hooks' in 'C:\Users\sivanq\Documents\BRGM SI SSP\ssp-frontend\ui\node_modules\elastic-apm-node\lib\instrumentation'
[...] and so on

Am I doing right ?

Elasticsearch/Kibana/APM Server version : 6.7.0

Hi Quentin,

Apologies for the delay.

Are you trying to use the Node.js agent with Typescript? If yes, Could you please paste your tsconfig.json, It seems to me like an issue with CommonJS vs ES6 modules exports. Please have a look at our documentation https://www.elastic.co/guide/en/apm/agent/nodejs/current/es-modules.html#esm-typescript

Thanks,
Vignesh

Hello,

Yes I'm using Typescript, in fact I got these errors just by adding the npm module.

Here is my tsconfig.json :

{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./",
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"module": "es2015",
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "es5",
"typeRoots": [
"node_modules/@types"
],
"lib": [
"es2017",
"dom"
]
}
}

Hi Quentin,

If you are using Typescript, you would have to tell the Typescript compiler about Node built in types and methods(ex: require). In order to do this, you need to install @types/node

$ npm i -D @types/node

// Add "node" to types property in tsconfig.json

Or, you can use Es6 modules and simply require the apm-agent this way

import * as apm from "elastic-apm-node"

OR

// if you set `esModuleInterop` to true is `tsconfig.json`
import apm from "elastic-apm-node" 

Thanks,
Vignesh