错误 - 不应导入命名导出

Posted 2023-03-13

【中文标题】错误 - 不应导入命名导出

【英文标题】：Error - Should not import the named export

【发布时间】：2021-09-14 10:32:55

【问题描述】：

我已将我的 Angular 项目更新到版本 12.0.5，将 Typescript 版本更新到 4.3.4，但我在编译项目时遇到了问题。

目前我在没有对分支进行更改的情况下收到以下错误：

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

这是import：

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

这就是我声明依赖于进口省份的变量的方式：

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

有什么问题？为什么会发生这种情况，我该如何解决？

【问题讨论】：

这能回答你的问题吗？ Importing JSON file in TypeScript

【参考方案1】：

在 Angular 12.2.5 中使用中间变量似乎对我有用：

import * as data from 'path/to/file.json'

let intermediateJson = data
//make it crash: console.log(data.property)
console.log(intermediateJson.property)

【参考方案2】：

我能够按照此处概述的步骤解决此问题：https://www.codegrepper.com/code-examples/javascript/read+json+file+in+typescript（这反过来又引用了一个 SO 帖子：Importing JSON file in TypeScript）

基本上，您必须将以下内容添加到您的 tsconfig.json 文件中（我将其添加到我的根 tsconfig.json 文件中，因为其他所有内容都继承自它）：

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

然后你可以使用默认导入来命名类：

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

【参考方案3】：

升级到 Angular 12.1.1 后我遇到了同样的问题

JSON 文件被构造为单个对象，因此我将其更改为对象数组并为我修复了错误。

【讨论】：

我该怎么做？你的意思是 tsconfig.json 文件？

【参考方案4】：

完成 afm215 的回答，这是我必须做的，以使应用程序运行并且规范测试文件成功运行：

import * as deMessages from 'devextreme/localization/messages/de.json';
...
@Component(
  selector: 'dkl-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss'],
)
export class AppComponent implements OnInit, OnDestroy 
...
constructor(
    private router: Router,
    private activatedRoute: ActivatedRoute,
    private translationService: TranslationService,
  ) 
    // Use the intermediate variable
    const messages = deMessages;
    loadMessages( de: messages.de ); // Here I used to have the problem
    ...
  

那么感谢 afm215！！