angular 2 离线模板编译出错 - @angular/http 没有导出的成员 HTTP_PROVIDERS

Posted 2023-03-13

【中文标题】angular 2 离线模板编译出错 - @angular/http 没有导出的成员 HTTP_PROVIDERS

【英文标题】：error on angular 2 offline template compilation - @angular/http has no exported member HTTP_PROVIDERS

【发布时间】：2016-10-05 11:08:19

【问题描述】：

我目前在应用组件级别设置 HTTP_PROVIDERS。通过 ./node_modules/.bin/ngc 运行编译器时，我看到了错误。

运行编译器时的完整错误是

Error: Error at /Users/girishnanda/Documents/offlinecompiler/src/app.component.ngfactory.ts:47:33: Module '"/Users/girishnanda/Documents/offlinecompiler/node_modules/@angular/http/http"' has no exported member 'HTTP_PROVIDERS'.
Error at /Users/girishnanda/Documents/offlinecompiler/src/app.component.ngfactory.ts:51:38: Module '"/Users/girishnanda/Documents/offlinecompiler/node_modules/@angular/http/http"' has no exported member 'HTTP_PROVIDERS'.
Error at /Users/girishnanda/Documents/offlinecompiler/src/app.component.ngfactory.ts:53:77: Cannot use 'new' with an expression whose type lacks a call or construct signature.
    at check (/Users/girishnanda/Documents/offlinecompiler/node_modules/@angular/compiler-cli/tsc.js:32:15)
    at Tsc.typeCheck (/Users/girishnanda/Documents/offlinecompiler/node_modules/@angular/compiler-cli/tsc.js:67:9)
    at /Users/girishnanda/Documents/offlinecompiler/node_modules/@angular/compiler-cli/main.js:39:23
    at process._tickCallback (node.js:406:9)
    at Function.Module.runMain (module.js:449:11)
    at startup (node.js:141:18)
    at node.js:933:3
Compilation failed

我设置 HTTP_PROVIDERS 的应用组件

import Component from '@angular/core';
import HTTP_PROVIDERS from '@angular/http';
@Component(
  selector: 'app',
  template: `test
               `,
  providers: [HTTP_PROVIDERS]
)
export class AppComponent 
  constructor()  

使用的 Compiler、Compile-cli、typescript 和 @angular/http 版本

"@angular/compiler": "2.0.0-rc.1",
"@angular/compiler-cli": "0.2.0",
"@angular/http": "2.0.0-rc.1",
"typescript": "^1.9.0-dev.20160605-1.0"

Tsconfig.json

    "compilerOptions": 
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "target": "es5",
        "module": "commonjs",
        "moduleResolution": "node",
        "removeComments": true,
        "sourceMap": true,
        "outDir": "built",
        "noImplicitAny": false
    ,
    "exclude": [
        "typings/main.d.ts",
        "typings/main",
        "node_modules"
    ]

Typings.json

  
        "globalDependencies": 
            "core-js": "registry:dt/core-js#0.0.0+20160317120654",
            "jasmine": "registry:dt/jasmine#2.2.0+20160505161446",
            "node": "registry:dt/node#4.0.0+20160509154515"
        
    

如果我不包含 HTTP_PROVIDERS，则编译运行成功，没有错误。关于我可能需要更改哪些内容以便我可以使用 HTTP_PROVIDERS 进行编译的任何指导都会有所帮助。

回复尝试在引导程序上添加提供程序的评论。 这是我的 main.ts。我还没有弄清楚如何添加额外的提供者。这是离线编译器的基本示例。

import coreBootstrap, ReflectiveInjector, enableProdMode from '@angular/core';
import browserPlatform, BROWSER_APP_COMMON_PROVIDERS, BROWSER_APP_STATIC_PROVIDERS from '@angular/platform-browser';
import AppComponentNgFactory from './app.component.ngfactory';
import AppComponent from './app.component';

enableProdMode();

const appInjector =
    ReflectiveInjector
    .resolveAndCreate(BROWSER_APP_COMMON_PROVIDERS, browserPlatform().injector);
coreBootstrap(appInjector, AppComponentNgFactory);

【问题讨论】：

如果从 main.ts 导入 HTTP_PROVIDERS，设置 bootstrap(AppComponent, [HTTP_PROVIDERS]);并将其从 app.component 中删除，会出现什么？

@KayoLima 我刚刚更新以在上面显示我的 main.ts。我还没有弄清楚如何将其他提供程序添加到离线编译器的基本示例中。它不像将 HTTP_PROVIDERS 添加到可以采用数组的 resolveAndCreate 那样简单。

【参考方案1】：

这对我有用。

const appInjector =
    ReflectiveInjector
    .resolveAndCreate([
      BROWSER_APP_PROVIDERS,
      HTTP_PROVIDERS
    ], browserPlatform().injector);
coreBootstrap(someComponentNgFactory, appInjector);