0

我想使用 typescript 创建一些围绕 durandal 的包装器，以便为我的开发团队轻松创建新的 SPA 应用程序。

让我简要描述一下我想要构建包装器的方式；开发人员需要配置初始引导类和配置以设置新应用程序。这是我现在可以实现的。

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

应用程序.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 后。我没有看到我的 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 可以加载我的应用程序。

我的问题是：我做错了什么，为什么我在输入apphost 后看不到所有属性和 Init 方法。

4

1 回答 1

1

如果您在require通话后想要智能感知/类型安全，则需要使用import foo = require('filename')语法。

所以，

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

这些是 typescript 中已知的外部模块，您需要使用编译--module器标志编译代码。

PS：我有一个关于这个主题的视频http://www.youtube.com/watch?v=KDrWLMUY0R0&hd=1

于 2014-02-06T10:29:00.920 回答