Question

我正在使用Typescript构建一个小的Angular2应用程序，到目前为止一直很好。

我想使用一个名为config的文件，它将包含应用程序的所有设置和类似设置。这是队列中的文件：

ConfigObject.js

export var ConfigObject = {
    apiVersion : 'v1/',
    productBox : 'http://localhost:8931/api/'
};

我正在尝试将其导入服务以便使用某些设置，但它说该文件无法找到。

这是我的服务：

import { Component, Injectable } from 'angular2/core';
import { Http, Response } from 'angular2/http';
import 'rxjs/add/operator/map';

import { ConfigObject } from '../../ConfigObject';


import { PRODUCTS } from '../data-stores/mock-products';

@Injectable()
export class ProductService {
    constructor(private http: Http) {

    }
    private APIUrl = ConfigObject.apiVersion;
    getHeroes() {
        return Promise.resolve(PRODUCTS);
    }
    getHeroesSlowly() {
        /*return new Promise<Hero[]>(function(resolve) {
            setTimeout(function() {
                return resolve(HEROES);
            }, 2000)
        });*/
        // The below is the new fat arrow version of the above
        /*return new Promise<Hero[]>(resolve =>
            setTimeout(() => resolve(HEROES), 2000)
        );*/
    }
}

ConfigObject文件位于应用程序的根目录中，2个文件夹。当我尝试启动应用程序时，我在控制台中收到以下错误：

获取http://localhost:3000/ConfigObject 404（未找到）

我不确定为什么会这样？

谢谢！

Answer 1

问题与您的SystemJS配置有关。由于您有错误：http://localhost:3000/ConfigObject这意味着没有规则可以将模块名称（../../ConfigObject）与实际的JS文件正确链接。

您可以尝试在根级别的配置中定义defaultExtension到js：

System.config({
  defaultExtension: 'js',
  (...)
});

否则，您需要将文件移动到定义规则的源文件夹中。例如app具有以下配置的那个：

System.config({
  (...)
  packages: {
    app: {
      defaultExtension: 'js'
    }
  }
});

有关详细信息，请参阅此文档：

https://github.com/systemjs/systemjs/blob/master/docs/config-api.md

使用Typescript导出Angular2中的对象文字

1 个答案: