в моем компоненте я хочу установить templateUrl, используя require, например:

import {Component} from 'angular2/core';


@Component({
    selector: 'header',
    styleUrls: ['app/header/header.css'],
    templateUrl: require('./hahaha.html')
})
export class HeaderComponent {

  logoUrl: string = '/resources/img/branding.png';


  constructor () {

  }

}

В моей консоли я получил ошибку

angular2-polyfills.js: 332 Ошибка: TypeError: require не является функцией в eval (HTTP: // локальный: 3000 / приложение / заголовок / header.js: 29: 35) при выполнении (HTTP: // локальный: 3000 / приложение / заголовок / header.js: 34: 14) Ошибка загрузкиHTTP: // локальный: 3000 / приложение / main.js

Я хочу быть в состоянии сделать что-то вроде этого: (Я знаю обходной путь, но я просто хочу знать больше, как заставить это работать по-другому)

// Note that this is a relative path, which I will get error for now, I have to write from root path, don't like it.
styleUrls: ['./header.css']  
templateUrl: require('./hahaha.html')

Это мой tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "module": "system",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false
  },
  "exclude": [
    "node_modules",
    "typings/main",
    "typings/main.d.ts"
  ]
}