2014-02-05 2 views
0

Я хотел бы создать некоторую оболочку вокруг durandal с помощью машинописного текста, чтобы упростить создание новых SPA-приложений для моей команды разработчиков.durandal typescript bootloader

Позвольте мне вкратце описать способ, которым я хотел бы структурировать свою обертку; был бы начальный класс начальной загрузки и конфигурация, которую разработчику необходимо настроить для настройки нового приложения. вот что я мог бы достичь на данный момент.

appcore.d.ts

declare module 'system/App' 
{ 
    var appcore: SpaApp; 
    export = appcore; 
} 

interface SpaApp { 
    isInDebugMode: boolean; 
    InitRoute: InitialRoute; 
    AppTitle: KnockoutObservable<string>; 
    Init:() => void; 
} 
interface InitialRoute { 
    Viewmodel: string; 
    animationMode: string; 
} 

app.ts

import app = require('durandal/app'); 
import viewlocator = require('durandal/viewLocator'); 
import system = require('durandal/system'); 

class Bootloader implements SpaApp 
{ 
    isInDebugMode: boolean; 
    InitRoute: InitialRoute; 

    AppTitle: KnockoutObservable<string>; 

    Init:() => void; 

    constructor(title: string) 
    { 
     this.AppTitle = ko.observable<string>(); 
     this.InitRoute = { Viewmodel: 'dsasda', animationMode: 'entrance' }; 
     this.Init = this.initapp; 
    } 

    private initapp() 
    { 
     system.debug(this.isInDebugMode); 
     app.title = this.AppTitle(); 
     app.configurePlugins({ 
      router: true, 
      dialog: true, 
      widget: true 
     }); 

     app.start().then(() => { 
      viewlocator.useConvention(); 
      app.setRoot(this.InitRoute.Viewmodel, this.InitRoute.animationMode); 
     }); 
    } 
} 

export = Bootloader; 

это все компилирует хорошо и app.ts скомпилирован как модуль AMD, но реальные проблема начинается, когда я пытался создать основную точку доступа для моего приложения

main.ts

requirejs.config({ 
    paths: { 
     'text': '../Libs/text', 
     'durandal': '../Libs/durandal', 
     'plugins': '../Libs/durandal/plugins', 
     'transitions': '../Libs/durandal/transitions', 
     'knockout': '../Libs/knockout' 
    } 
}); 

var apphost = require('system/App'); 

после ввода apphost. Я не вижу никакого проникновения для моей афоры. то, что я хотел бы достичь, - это main.ts таким образом.

requirejs.config({ 
    paths: { 
     'text': '../Libs/text', 
     'durandal': '../Libs/durandal', 
     'plugins': '../Libs/durandal/plugins', 
     'transitions': '../Libs/durandal/transitions', 
     'knockout': '../Libs/knockout' 
    } 
}); 

var apphost = require('system/App'); 

apphost.AppTitle('my sample SPA app'); 
apphost.isInDebugMode = true; 
apphost.InitRoute = { 
    Viewmodel: 'viewmodels/shell', 
    animationMode: 'entrance' 
}; 

apphost.Init(); 

и составил в main.js так requirejs может загрузить мое приложение.

мой вопрос: что я делаю неправильно, и почему я не могу увидеть все свойства и метод Init после ввода apphost.

ответ

1

Если вы хотите использовать intellisense/typesafety после вызова require, вам нужно использовать синтаксис import foo = require('filename').

так,

import apphost = require('system/App'); 

Они известны и внешние модули в машинописи, и вы должны скомпилировать код с флагом в --module компилятором.

PS: У меня есть видео по теме http://www.youtube.com/watch?v=KDrWLMUY0R0&hd=1

Смежные вопросы