How do I use @types/fhir in angular cli project

Question

When i npm install this library into my cli project and try to reference the types within it i get this:

 error TS2306: File 'C:/ng-ikr-lib-test/node_modules/@types/fhir/index.d.ts' is not a module.

Here is my tsconfig:

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

and my app tsconfig which extends the above.

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/app",
    "module": "es2015",
    "types": ["fhir"]
  },
  "exclude": [
    "src/test.ts",
    "**/*.spec.ts"
  ]
}

How are you supposed to use the types defined in this library in an angular-cli app?

https://www.npmjs.com/package/@types/fhir

I wonder, would you need to install [this](https://www.npmjs.com/package/fhir), too? Usually, you need the library, and the types together. I have never used this library, so this is a guess. The docs seem a little light on the subject. — R. Richards, Aug 02 '18 at 22:19

score 3 · Answer 1 · answered Nov 21 '18 at 03:50

3

If others stumble upon this, I published a repackaged version of this library to the public npm registry. You can find it here:

https://www.npmjs.com/package/fhir-stu3

Cheers.

answered Nov 21 '18 at 03:50

cobolstinks

6,801
16
68
97

1

THANK YOU! This will be very helpful to those of us working with FHIR responses in Angular. Much appreciated! – Brandon Taylor Nov 21 '18 at 14:18
1

You're welcome, glad I could help. I know this problem drove me nuts for awhile. – cobolstinks Nov 21 '18 at 14:32

score 1 · Accepted Answer · answered Aug 03 '18 at 19:51

1

The easiest way I've found is to reference the types with the following line at the top of your file:

///<referencepath="../../../node_modules/@types/fhir/index.d.ts"/>

For example, the references at the top of my fhir.service.ts file look like this:

///<reference path="../../../../node_modules/@types/fhir/index.d.ts"/>
import {Injectable} from '@angular/core';
import {Observable, throwError} from 'rxjs';
import {HttpClient, HttpHeaders, HttpParams} from '@angular/common/http';

import Patient = fhir.Patient;
import Observation = fhir.Observation;
import Bundle = fhir.Bundle;
import Medication = fhir.Medication;

You can find out more background information at https://www.typescriptlang.org/docs/handbook/declaration-files/library-structures.html under the "Consuming Dependencies" section.

answered Aug 03 '18 at 19:51

Kevin Dufendach

184
1
7

Thanks, it seems like it boils down to the library author's style of packaging this library. It's packaged as a global library instead and thus needs the /// reference nasties. I ended up repackaging this library up so it doesn't run under the global scope. Thanks! – cobolstinks Aug 10 '18 at 23:44
@cobolstinks Is your repackaged library available on npm? – Brandon Taylor Nov 20 '18 at 17:21
1

@Brandon it's on an internal artifact repository.... I'll have to poke around at the license and see if I can publish the repackaged library to the public npm registry. – cobolstinks Nov 20 '18 at 17:43
1

@cobolstinks that would be amazingly helpful if possible – Brandon Taylor Nov 20 '18 at 18:30
1

@Brandon it's MIT so I should be ok, I'll try to publish it out tonight. – cobolstinks Nov 20 '18 at 22:54

How do I use @types/fhir in angular cli project

2 Answers2

Linked