Inversify.js - Reflect.hasOwnMetadataは関数ではありません

Question

私は使用しているTypescriptアプリケーションのInversify.jsを試しています。今のところ、関連するフレームワークはないので、純粋なES2015です。

私はメインページの例に従うようにしていますが、私はヒットしています： "Reflect.hasOwnMetadataは関数ではありません"というとき、ブラウザで実行しようとします。

私はパッケージバンドラーとしてWebpackを使用しています。ここで

は私のフォルダ構造です：

/// <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：

interface INinja { 
    fight(): string; 
    sneak(): string; 
} 

interface IKatana { 
    hit(): string; 
} 

interface IShuriken { 
    throw(); 
} 

inversifyここ

は、メインapp.tsファイルです。 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：

export const symbols = { 
    Match : Symbol("Match") 
} 

tsconfig.json：

{ 
    "compilerOptions": { 
    "noImplicitAny": false, 
    "experimentalDecorators": true, 
    "emitDecoratorMetadata": true, 
    "removeComments": true, 
    "sourceMap": true, 
    "target": "es5" 
    }, 
    "exclude": [ 
    "node_modules", 
    "bower_components", 
    "wwwroot" 
    ] 
} 

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のコンソールエラー：

WebPACKの出力：

私はInversifyをインストールしようとすると、次の警告がポップアップ：

が、それはバグですか？または私は何か間違っているのですか？ありがとう！

PS：サンプルファイルに続いて試しましたが、何も理解できませんでした。

私はASP.NET MVC 5 w/Ninjectから来ているので、ほとんどの構文に関連付けることができます。

Answer 1

reflect-metadataパッケージを含める必要があるようです。実行してinversify.config.tsでそれをインポートを追加してみてください：

import "reflect-metadata"; 

Answer 2

を指摘する愚かなものになるかもしれませんね、私は同じ問題に遭遇したが、それはので、輸入品の程度でした。 他のインポートではそうは考えにくいが、リフレクションメタデータの場合は、それを使用するクラスの前にインポートする必要があります。

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";