Import 将TypeScript与Dojo一起使用-导入/导出问题

在我工作的公司，我们正在使用Dojo框架，最近我开始推动将其与TypeScript一起使用。 我环顾四周，发现了这篇关于这个主题的伟大文章，你可以在这里找到：

此解决方案中的最后两行是：

var exp = _declare("alloy.editors.StringListTs", [_Widget, _TemplatedMixin, _WidgetsInTemplateMixin, _CssStateMixin, _ValueRequiredMixin], new StringList());

export = exp;

我遵循了同样的模式，效果非常好，除了两个问题，我似乎没有一个好的解决方案： 1.如果您查看解决方案，在调用dojo declare方法时，需要实例化创建的类（这是因为dojo查看的是属性而不是原型）。

---

2.更麻烦的问题是，我导出的是dojo声明的对象，而不是它本身的类。当您尝试导入类（typescript导入）时，这是有问题的，即使我将变量exp声明为类类型，我也会收到一个错误，说我尝试导入的内容没有构造函数。

我遇到了您同样的问题，对我来说，这是一个传输问题

TL；DR如果您使用“语法中的

import*作为WidgetName导入某些内容，并且没有在js中使用
WidgetName
（就像您在模板中对小部件所做的那样），则transpiler将不会导入该内容。使用
导入“”


详细回答：这是我第一次使用TypeScript，与您类似，我正在将dojo项目转换为TypeScript。为了帮助更多的人，我将介绍一些帮助我正确导入模块的步骤

步骤0dojoConfig包

在dojoConfig上定义您自己的包不起作用，必须使用相对路径引用模块

明确地说，在这个例子中：

dojoConfig = {
    ...
    packages : [ { name : "myproject",    location : "js/myproject" },
                 { name : "dojo",  location : dojoBase+"dojo"   }, 
                 { name : "dijit", location : dojoBase+"dijit" },
                 { name : "dojox", location : dojoBase+"dojox"  } ]
};

不可能让widget从'myproject/WidgetName'以
import*作为WidgetName导入彼此，而是必须从'./WidgetName'
以
import*作为WidgetName导入（注意'.'与'myproject'）

步骤1：导入dojo声明（据我所知，不是强制性的）

我依赖于node，我使用
npm安装dojo类型--save dev
来拉dojo类型。在
文件
属性中，我指定了
[“src/js/***.ts”、“src/js/***.js”、“node_modules/dojo typings/dojo/1.11/index.d.ts”、“node_modules/dojo typings/dojo/1.11/modules.d.ts”、“node_modules/dojo typings/dijit/1.11/index.d.ts”]

步骤2：使用transpiler上的正确选项：

{
    "target": "es5",
    "allowJs": true,
    "module": "amd",
    "moduleResolution": "classic",
    "noImplicitUseStrict" : true
},

noimplicitustestrict
解决了错误dojo/parser:：parse（）error TypeError:“调用方”、“被调用方”和“参数”属性不能在严格模式函数或用于调用它们的参数对象上访问
allowJs
允许我将TypeScript和本机dojo混合在一起

步骤3：使用导出返回

这是一个非常简单的模块示例，它不需要/导入任何内容，只导出一个
log
方法（文件为'toast.ts'）：

结论：缺少的构造函数很可能来自您导入模块的方式，检查传输的代码有助于我了解问题所在。要成功导入，这里和那里都需要一点准确性（上面的所有步骤都应该给出一个概述）


我仍在转换我的项目（其他问题可能会出现），但我希望这也能帮助其他尝试在Dojo中使用TypeScript的可怜人

const log  = function(message) { 
    window['dojo'].publish("mainTopic",
            [{
                message: "<span style='font-size: 12px;'>" + message +"</span>",
                type: 'info',
                duration: 3000
            }]
        );
}

export { log }

define([ ],

        function(){

    var log = function(message) {
        dojo.publish("mainTopic",
                [{
                    message: "<span style='font-size: 12px;'>" + message +"</span>",
                    type: 'info',
                    duration: 3000
                }]
            );
    };

    return { log : log };

});

/// <amd-dependency path="dojo/text!./Main.html" name="template" />
declare var template: string;

import * as _Widget from 'dijit/_Widget';
import * as _TemplatedMixin from 'dijit/_TemplatedMixin';
import * as _WidgetsInTemplateMixin from 'dijit/_WidgetsInTemplateMixin';
import * as dojoDeclare from 'dojo/_base/declare';

import './MyVanillaJavascriptWidget';
import './MyModule';
import 'dojox/widget/Toaster';

import toast = require('./utility/toast');

export default dojoDeclare("mm.Main", [ _Widget, _TemplatedMixin, _WidgetsInTemplateMixin ], {
    templateString : template,
});

define([ "dijit/_Widget", "dijit/_TemplatedMixin", "dijit/_WidgetsInTemplateMixin",
         "dojo/_base/declare", "dojo/text!./Main.html",
         "dojox/widget/Toaster", "./MyVanillaJavascriptWidget", "./MyModule"
         ],

    function(   _Widget, _TemplatedMixin, _WidgetsInTemplateMixin, declare, mainTemplate, toast) {

    return declare("mm.Main", [ _Widget, _TemplatedMixin, _WidgetsInTemplateMixin ], {

        templateString : mainTemplate,

    });

});