加载插件时的Typescript + RequireJS编译器错误

Question

在我使用RequireJS加载模块（我使用Visual Studio 2015）时编写了一个Typescripts应用程序。

我可以使用他们的打字.d.ts文件轻松地加载几乎所有的模块，这些模块可以从我从外部库编写的.ts类中加载。

但我的问题开始，我想加载一个jQuery插件。

我正在使用库的键入文件，但逻辑上在.d.ts文件中没有模块定义，因为它只是jQuery的一个插件。

我从RequireJS website遵循垫片库加载的建议是这样的：根据RequireJS website

requirejs.config({ 
baseUrl: "Scripts", 
paths: { 
    "jquery": "jquery-2.2.3", 
    "jquery.pjax": "jquery.pjax" 
}, 
shim: 
{ 
    "jquery.pjax": 
    { 
     deps: ["jquery"], 
     exports: "jQuery.fn.pjax" 
    } 
} 
}); 
require(["app"]); 

和：

垫片配置仅设置了代码的关系。要加载属于或使用shim config的模块，需要正常的require/define调用。设置垫片本身不会触发代码加载。

现在，既没有加载插件以下工作的（未来移动jquery.pjax.dt到jquery.pjax.js后连）：

import * as pjax from "jquery.pjax"; 

import pjax = require("jquery.pjax"); 

import pjax = require("./jquery.pjax"); 

import pjax = require("jquery.pjax.js"); 

import pjax = require("./jquery.pjax.js"); 

编译器抱怨与错误Cannot find module "jquery.pjax"或File C:/foo/bar/jquery.pjax.d.ts is not a module。

只要上述任何代码存在，app.ts就不会被编译，当我删除它们时，插件不会被加载。

考虑到我在我的app.ts文件中使用了多个导入，并且会有更多的导入，我倾向于使用import Foo = require("foo")或import * as Foo from "foo"模块加载样式来反对手动编写AMD定义函数。

此外，我正在使用Nuget包管理，我不喜欢手动编辑/移动外部.d.ts或.js文件。

任何人都可以帮我解决这个问题吗？

Answer 1

如果你想能够调用require("jquery.pjax")然后要么需要有一个真正的打字稿模块定义和容易找到与该名字，或者需要有地方它的声明：declare module "jquery.pjax"。

我觉得你的选择是：

• 负荷的jQuery完全RequireJ外部（包括jQuery和jQuery.pjax在网页中用纯脚本标记，只是用它们在全球范围）。这就是你所期望的.d.ts文件，因为jQuery.pjax根本不是RequireJS模块（这就是为什么你必须使用你的shim配置）
• 添加一个模块声明到您的代码库并说服TypeScript它是一个真正的RequireJS模块。这可以在jquery.pjax的现有.d.ts定义中，也可以在独立文件中单独使用，如果这对您更容易。然后你可以要求这个。请注意，如果您需要它并且不引用它，TypeScript将不会实际输出依赖关系，因此您需要一个虚假的引用。

• 使用RequireJS在TypeScript的模块系统之外手动加载它。对于这样的插件生态系统，我通常在我的RequireJS路径中给真正的库命名为'raw-libraryname'，然后自己创建一个新的'libraryname.ts'，该库引入原始库和插件，进行任何设置，并返回结果（其他人通常可以依赖的结果）。例如：

  // Require config: 
  requirejs.config({ 
      baseUrl: "Scripts", 
      paths: { 
       "raw-jquery": "jquery-2.2.3", // only plugins depend on this 
       "jquery.pjax": "jquery.pjax", 
       "jquery": "lib-wrappers/jquery" // everything else uses this which 
               // includes all your plugins 
      }, 
      shim: 
      { 
       "jquery.pjax": 
       { 
        deps: ["raw-jquery"] 
        // I don't think you need an exports here. 
        // Anybody who wants this should be using it from jQuery. 
       } 
      } 
  }); 
  
  
  
  // in lib-wrappers/jquery.ts 
  define(["raw-jquery", "jquery.pjax"], function ($) { 
      // RequireJS guarantees that this line is run before anything that 
      // depends on jQuery, and after both jQuery & any plugins above are loaded 
      return $; 
  }); 
  

  这保证了一切可以继续使用jQuery通过RequireJS为常，同时还保证了非requirejs模块（jquery.pjax）将准备并加载它们尝试从jQuery的使用它之前。