typescript Inversify.js - Reflect.hasOwnMetadata 不是函数
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/37534890/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Inversify.js - Reflect.hasOwnMetadata is not a function
提问by Jose A
I'm trying out Inversify.js for a Typescript application I'm using. Right now, there is no framework involved, so it's pure ES2015.
我正在为我正在使用的 Typescript 应用程序尝试 Inversify.js。目前,没有涉及任何框架,所以它是纯 ES2015。
I'm trying to follow along the example in the main page, but I'm being hit with: "Reflect.hasOwnMetadata is not a function" when I try to run it in the browser.
我正在尝试按照主页中的示例进行操作,但是当我尝试在浏览器中运行它时,我遇到了:“Reflect.hasOwnMetadata 不是函数”。
I'm using Webpack as package bundler.
我使用 Webpack 作为包打包器。
Here is my folder structure:
这是我的文件夹结构:
Here is the main app.ts file:
这是主要的 app.ts 文件:
/// <reference path="../typings/index.d.ts" />
/// <reference path="./domain/abstract/match.interface.ts" />
import kernel from "../inversify/inversify.config.ts";
import {symbols} from "../inversify/symbols.ts";
var ninja = kernel.get<INinja>("INinja");
ninja.fight();
ninja.sneak();
interfaces.d.ts:
接口.d.ts:
interface INinja {
fight(): string;
sneak(): string;
}
interface IKatana {
hit(): string;
}
interface IShuriken {
throw();
}
inversify.config.ts
逆向配置文件
/// <reference path="../node_modules/inversify/type_definitions/inversify/inversify.d.ts" />
/// <reference path="../node_modules/reflect-metadata/reflect-metadata.d.ts" />
/// <reference path="inversify.ts" />
import {Kernel} from "inversify"
//import {MatchHub} from "../app/components/Hubs/match/match-hub.component.ts";
//import {symbols} from "./symbols.ts";
import {Ninja, Katana, Shuriken} from "./inversify.ts";
var kernel = new Kernel();
kernel.bind<INinja>("INinja").to(Ninja);
kernel.bind<IKatana>("IKatana").to(Katana);
kernel.bind<IShuriken>("IShuriken").to(Shuriken);
export default kernel;
symbols.ts:
符号.ts:
export const symbols = {
Match : Symbol("Match")
}
tsconfig.json:
tsconfig.json:
{
"compilerOptions": {
"noImplicitAny": false,
"experimentalDecorators": true,
"emitDecoratorMetadata": true,
"removeComments": true,
"sourceMap": true,
"target": "es5"
},
"exclude": [
"node_modules",
"bower_components",
"wwwroot"
]
}
Webpack.config.js:
Webpack.config.js:
module.exports = {
entry: './app/app.ts',
output: {
filename: '../Scripts/app/app.js'
},
resolve: {
extensions: ['', '.Webpack.js', '.web.js', '.ts','.js', '.tsx']
},
module: {
loaders: [
{
test: /\.ts?$/,
exclude: /(node_modules|bower_components)/,
loader: 'ts-loader'
}
]
},
watch: true
}
Firefox Console Error:
Firefox 控制台错误:
Webpack output:
网络包输出:
When I tried to install Inversify the following warnings popped up:
当我尝试安装 Inversify 时,弹出以下警告:
Is it a bug? Or am I doing something wrong? Thanks!
这是一个错误吗?还是我做错了什么?谢谢!
PS: Tried following the sample files, but I couldn't understand anything!
PS:尝试按照示例文件进行操作,但我什么也看不懂!
I come from ASP.NET MVC 5 with Ninject so I can relate for most of the syntax.
我来自带有 Ninject 的 ASP.NET MVC 5,因此我可以了解大部分语法。
回答by David Sherret
It seems you will need to include the reflect-metadatapackage. Try adding an import to it in inversify.config.tsby doing:
看来您需要包含反射元数据包。尝试通过执行以下操作在inversify.config.ts 中添加导入:
import "reflect-metadata";
回答by Mahesh
May be a silly thing to point out, I ran into a the same issue but it was because of the order of imports. Its unlikely to be the case for any other imports but in case of reflect-metadata it has to be imported before any classes that use it.
指出这可能是一件愚蠢的事情,我遇到了同样的问题,但这是因为导入的顺序。对于任何其他导入来说不太可能是这种情况,但是在反射元数据的情况下,它必须在使用它的任何类之前导入。
import { Container } from "inversify";
//reflect-metadata should be imported
//before any interface or other imports
//also it should be imported only once
//so that a singleton is created.
import "reflect-metadata";
import Battle from "./interfaces/battle";
import EpicBattle from "./interfaces/epic_battle";