Inversify.js - Reflect.hasOwnMetadata is not a function
<p>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. </p>

<p>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. </p>

<p>I'm using Webpack as package bundler. </p>

<p>Here is my folder structure:</p>

<p><a href="https://i.stack.imgur.com/cmjHG.png" rel="noreferrer"><img src="https://i.stack.imgur.com/cmjHG.png" alt="enter image description here"></a></p>

<p>Here is the main app.ts file:</p>

<pre><code>/// &lt;reference path="../typings/index.d.ts" /&gt;
/// &lt;reference path="./domain/abstract/match.interface.ts" /&gt;

import kernel from "../inversify/inversify.config.ts";

import {symbols} from "../inversify/symbols.ts";

var ninja = kernel.get&lt;INinja&gt;("INinja");

ninja.fight();
ninja.sneak();
</code></pre>

<p>interfaces.d.ts:</p>

<pre><code>interface INinja {
    fight(): string;
    sneak(): string;
}

interface IKatana {
    hit(): string;
}

interface IShuriken {
    throw();
}
</code></pre>

<p>inversify.config.ts </p>

<pre><code>/// &lt;reference path="../node_modules/inversify/type_definitions/inversify/inversify.d.ts" /&gt;
/// &lt;reference path="../node_modules/reflect-metadata/reflect-metadata.d.ts" /&gt;
/// &lt;reference path="inversify.ts" /&gt;

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&lt;INinja&gt;("INinja").to(Ninja);
kernel.bind&lt;IKatana&gt;("IKatana").to(Katana);
kernel.bind&lt;IShuriken&gt;("IShuriken").to(Shuriken);


export default kernel;
</code></pre>

<p>symbols.ts:</p>

<pre><code>export const symbols = {
    Match : Symbol("Match")
}
</code></pre>

<p>tsconfig.json:</p>

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

<p>Webpack.config.js:</p>

<pre><code>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
}
</code></pre>

<p>Firefox Console Error:</p>

<p><a href="https://i.stack.imgur.com/fMksv.png" rel="noreferrer"><img src="https://i.stack.imgur.com/fMksv.png" alt="firefox console error"></a></p>

<p>Webpack output:</p>

<p><a href="https://i.stack.imgur.com/COdiO.png" rel="noreferrer"><img src="https://i.stack.imgur.com/COdiO.png" alt="enter image description here"></a></p>

<p>When  I tried to install Inversify the following warnings popped up:</p>

<p><a href="https://i.stack.imgur.com/GML6R.png" rel="noreferrer"><img src="https://i.stack.imgur.com/GML6R.png" alt="enter image description here"></a></p>

<p>Is it a bug? Or am I doing something wrong? Thanks! </p>

<p>PS: Tried following the sample files, but I couldn't understand anything! </p>

<p>I come from ASP.NET MVC 5 with Ninject so I can relate for most of the syntax.</p>