0

I´m trying to import on my Angular component a module but it only contains a Javascript file and no typescript typings.

I did the following:

import { Component } from "@angular/core";
import * as Highcharts from 'highcharts';

declare function require(name:string);
const HC_Regression = require('highcharts-regression');
HC_Regression(Highcharts);

It works but it feels hacky plus I get a lot of warnings.

First because the function require as explicite type any and second because the function require doesn´t return anything.

Is there a better way of doing this?

How to use Highcharts regression plugin to plot a trend line using angular 8 wrapper

Thanks

esfomeado12
  • 11
  • 5

1 Answers1

0

You can create a file called highcharts-regression.d.ts which would be a TypeScript typings file. If you didn't want any typings, all you would need in the file would be

declare module 'highcharts-regression';

or you could take the time to write the typings. Then, in your tsconfig.json typeRoots field, which is an array, you would add a value of the directory that your .d.ts file is in. Then, when you import the module, the warnings should go away, but you won't have any types so it will all implicitly be any. I would recommend putting your types in a different directory, for example a root subdirectory under src or something so that it does not get mixed up with the rest of your code.

ztcollazo
  • 159
  • 1
  • 8
  • It complains that could not find a declaration for module ´highcarts-regression´ – esfomeado12 Jun 27 '23 at 19:12
  • That probably means typescript can't find the file... I would check to make sure that the types folder you put the file in is in the typescript `typeRoots` along with `node_modules/@types`. Here's the docs, I'm not sure what else would work: https://www.typescriptlang.org/tsconfig#typeRoots – ztcollazo Jun 28 '23 at 14:49