尝试导入json文件时出错

我有一个json文件需要导入到我的Angular 2应用程序中。我已经按照这How to Import json into TypeScript文章的步骤，但我得到一个“SyntaxError: Unexpected token :”的错误。你觉得我做错了什么？尝试导入json文件时出错

这里是我的代码：

完整的错误：

(index):28 Error: SyntaxError: Unexpected token : 
     at eval (<anonymous>) 
     at Object.eval (http://localhost:37967/Application/Settings.js:3:19) 
     at eval (http://localhost:37967/Application/Settings.js:92:4) 
     at eval (http://localhost:37967/Application/Settings.js:93:3) 
     at eval (<anonymous>) 
    Evaluating http://localhost:37967/appSettings.json 
    Evaluating http://localhost:37967/Application/Settings.js 
    Evaluating http://localhost:37967/Application/BaseComponent.js 
    Evaluating http://localhost:37967/Application/Components/Home/Home.js 
    Evaluating http://localhost:37967/Application/Module.js 
    Evaluating http://localhost:37967/Application/Startup.js 
    Error loading http://localhost:37967/Application/Startup.js

Settings.ts：

/// <reference path="../scripts/typescriptdefinitions/typings.d.ts" /> 
.. 
import * as appSettings from '../../appSettings.json'; 
.. 
    public static get AppSettings(): any{ 
     return <any>appSettings; 
    } 
..

typings.d.ts：

declare module "*.json" { 
    const value: any; 
    export default value; 
}

appSettings.json：

{ 
    "AppSettings": { 
    "Url": ... 
    } 
}

我检查网络面板和文件加载200 OK。 json的内容也是有效的json。

来源

2017-07-20 dstr

问题：FMY可以请我解释一下导入json文件vs加载http.request（）的目的吗？ – Vega

@Vega：使用http加载它是异步的。 json文件包含API的url，我在主页上调用了API，并且由于在完成json http请求之前执行的主页上的调用，所以出现了错误。导入是同步的，所以这消除了这个问题。 – dstr

很好的解释，谢谢！ – Vega

您引用的示例旨在运行在CommonJS环境中，大概是Node。在这种情况下，import声明将变为require声明。在节点做require("foo.json")是非常好的：Node知道它不应该尝试执行的JSON文件。

不过，如果你不加载在节点上CommonJS的模块，你通常需要告诉一个JSON文件必须专门治疗的捆绑或加载器。否则，该工具会认为您正在加载代码，并会尝试执行它。

您向我建议您使用SystemJS的错误消息。随着SystemJS要与一个meta会告诉你要加载的文件应载有json装载机SystemJS设定SystemJS配置：

meta: { 
    "path/to/file": { 
     loader: "json", 
    }, 
    },

而且你需要安装systemjs-plugin-json。 path/to/file可能包含通配符，如果您有多个文件需要加载为json。例如，我有project/config/*，因此project/config/中的所有文件都被视为JSON。不幸的是，SystemJS支持的通配符没有很好的文档记录，因此您可能需要尝试查看哪些适合您。

来源

2017-07-20 13:11:04 Louis

尝试导入json文件时出错

回答

相关问题