【问题标题】:Angular 2 local storage - "has no exported member" compilation errorsAngular 2 本地存储 - “没有导出的成员”编译错误
【发布时间】:2017-02-16 19:56:07
【问题描述】:

提前感谢您的帮助。我正在尝试使用打字稿在 Angular 2 中获得本地存储访问权限。我正在使用 npm 包 angular2-localstorage。我有 angular.io “英雄之旅” 工作(没有太多样式)。我按照https://www.npmjs.com/package/angular2-localstorage 的说明进行操作。将建议的代码添加到我的 app.module.ts 文件后,我尝试使用npm start 运行,并得到以下编译错误:

node_modules/angular2-localstorage/LocalStorageEmitter.ts(46,9): error TS2305: Module '"/Users/joshuaforman/Documents/CodeCraft/a2quickstart/a2-angular/node_modules/@angular/core/src/facade/lang"' has no exported member 'Type'.
node_modules/angular2-localstorage/LocalStorageEmitter.ts(47,9): error TS2305: Module '"/Users/joshuaforman/Documents/CodeCraft/a2quickstart/a2-angular/node_modules/@angular/core/src/di"' has no exported member 'provide'.

您可以在此处查看所有代码:https://github.com/joshuaforman/angular2-quickstart

此外,这里是完整的 app.module.ts 文件(我更改的唯一一个导致错误发生的文件):

import { NgModule }       from "@angular/core";
import { BrowserModule }  from "@angular/platform-browser";
import { FormsModule }    from "@angular/forms";
import { HttpModule }    from "@angular/http";

// added for LocalStorage
// followed instructions here: https://www.npmjs.com/package/angular2-localstorage
import { LocalStorageService, LocalStorageSubscriber } from "angular2-localstorage/LocalStorageEmitter";

// Imports for loading & configuring the in-memory web api
import { InMemoryWebApiModule } from "angular2-in-memory-web-api";
import { InMemoryDataService }  from "./in-memory-data.service";

import { AppComponent }        from "./app.component";
import { HeroDetailComponent } from "./hero-detail.component";
import { HeroesComponent }     from "./heroes.component";
import { HeroService }         from "./hero.service";
import  { DashboardComponent } from "./dashboard.component";

import { routing } from "./app.routing";

@NgModule({
  imports: [
    BrowserModule,
    HttpModule,
    InMemoryWebApiModule.forRoot(InMemoryDataService),
    FormsModule,
    routing
  ],
  declarations: [
        AppComponent,
        HeroesComponent,
        HeroDetailComponent,
        DashboardComponent
  ],
  bootstrap:    [ AppComponent ],
  providers:    [
        HeroService,
        LocalStorageService // added for Local Storage
  ]
})
export class AppModule {
  // added for Local Storage
  constructor(storageService: LocalStorageService) {}
}

我为实现包含文本“LocalStorage”的本地存储而添加的每一行都有注释。如果您注释掉这三行,编译和运行时就可以正常工作。

此时,我只想能够编译成功。谢谢。

注意:这是我在堆栈上的第一个问题。过去我在这里找到了很多答案,并且在提出这个问题时我已尽力遵循惯例。欢迎任何关于我在提问时应该做些什么的富有成效的反馈。

【问题讨论】:

  • 最后我知道 angular2-localstorage 与 Angular 的最后几个版本不兼容。 github 甚至列出了它不再维护。如果您需要本地/会话存储,我建议您切换库。我发现Angular2 Cool Storage 效果很好
  • 嗯,这样就行了,不是吗?我会在周末尝试 Cool Storage 并报告。谢谢。
  • 我确认这个库不符合最新的 angular2 版本。您应该使用管理网络存储的其他设备之一。就像 Dave V 说的,你可以使用我几个月前创建的 angular2 冷存储或ng2-webstorage

标签: angular typescript angular-local-storage


【解决方案1】:

Angular2-LocalStorage 不再维护,您必须使用另一个库,直到该库获得活跃的维护者。我推荐 Angular2 Cool Storage

【讨论】:

  • 谢谢。这确实解决了编译错误。但是现在我得到一个运行时错误。遵循自述文件并将此行添加到我的 app.module.ts 文件 imports: [CoolStorageModule] 时,我收到此错误:zone.js:1274 GET http://localhost:3000/angular2-cool-storage 404 (Not Found)。你能提供什么帮助吗?
  • 我注意到的一件事是,在我的网络选项卡中,zone.js:1274 启动了很多获取,全部用于 .js 文件。除了 angular2-cool-storage,它没有 .js 扩展名,并且是唯一有错误的文件。我已将尝试使用冷存储的代码上传到我的 git 存储库 - github.com/joshuaforman/angular2-quickstart
  • 我想通了。除了自述文件中的说明外,我还必须设置 system.config.js 文件才能使用 Cool Storage。我想这是一个有经验的 Angular 2 开发者知道该怎么做。具体来说,我将此行添加到 map 属性:"angular2-cool-storage": "npm:angular2-cool-storage" 并将这些行添加到 packages 属性:"angular2-cool-storage": { main: "./cool-storage.js", defaultExtension: "js" }
  • 我应该想到的,我用SystemJS已经有一段时间了,完全忘记了那部分。很高兴它对你有用!
  • 感谢您给我的帮助。 Cool Storage 很棒,而且非常易于使用。我对你的答案投了赞成票,但我没有足够的堆栈代表来显示它。
【解决方案2】:

从 node_modeule "angular2-localstorage" 中替换 "LocalStorageEmitter.ts" 中的这一行

import {Type} from "@angular/core/src/facade/lang";
import {provide} from "@angular/core/src/di";
import {ComponentRef} from "@angular/core";

export function LocalStorageSubscriber(appPromise: Promise<ComponentRef<any>>) {
    appPromise.then((bla) => {
        bla.injector.get(<Type>LocalStorageService);
    });
}

有了这个。

import {Type} from "@angular/core/src/type";
import {Provider} from "@angular/core/src/di";
import {ComponentRef} from "@angular/core";

export function LocalStorageSubscriber(appPromise: Promise<ComponentRef<any>>) {
    appPromise.then((bla) => {
        bla.injector.get(<Type<any>>LocalStorageService);
    });
}

这对我有用...

更多详情 => https://github.com/marcj/angular2-localstorage/issues/66

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2016-10-05
    • 2021-02-10
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-03-19
    • 2021-11-07
    • 2019-04-13
    相关资源
    最近更新 更多