Search code examples
angulartypescriptangular12

Error - Should not import the named export

I have updated my Angular project to version 12.0.5 and Typescript version to 4.3.4 and I am having trouble compiling the project.

Currently I get the following error without having made changes to the branch:

Should not import the named export 'provinces' (imported as 'data') from default-exporting module (only default export is available soon)

This is the import:

import { ApiService, Municipality, Province } from '../../services/api.service';

And this is how I declare the variables that depend on the import Province:

public provinces: Province[] = [];
  private currentPorvince: Province;

What is the problem? Why is this happening and how can I solve it?

Solution

  • I was able to resolve this by following the steps outlined here: https://www.codegrepper.com/code-examples/javascript/read+json+file+in+typescript (which in turn references a SO post: Importing JSON file in TypeScript)

    Basically, you have to add the following to your tsconfig.json file (I added it to my root tsconfig.json file since everything else inherits from it):

    "resolveJsonModule": true,
"esModuleInterop": true,

    Then you can use default importing to name the class:

    import { default as data } from '../../services/api.service';
data.provinces