Question

我是打字稿的新手，我试图了解模块/包在打字稿中的工作原理。

我目前需要使用slick-carousel来创建一个简单的图像滑块。

然而..我已经设法安装了jquery ..但是我不知道如何使用光滑的打字机。

到目前为止，我已经使用npm typings来安装我的软件包。

所以我刚刚运行了typings install slick-carousel ..定义文件显示正常... 但..定义文件不包含任何声明接口.. 所以我不能真正“导入”光滑的轮播到我需要使用它的文件中（我可能是错的）..所以我想这个包应该扩展已经存在的jquery导入的一些原因..

然而..如果我这样做：

import * as $ from 'jquery';

class Splash {
    init() {
        $.slick();
    }
}

然后

$.slick();

无法解决..

所以..你如何“导入”只扩展像jquery这样的预先存在的包的包？

提前致谢！

Answer 1

使用AMD模块加载器（例如RequireJS）将确保只有在加载了所有外部模块及其依赖项后才运行代码。

以下是使用RequireJS与shim config：

的示例

<强>的index.html

<head>
    <title>jQuery++Slick+RequireJS Sample Page</title>
    <script data-main="app" src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.2/require.js"></script>
</head>

<body>
    <h1>jQuery++Slick+RequireJS Sample Page</h1>
    <p>Look at source or inspect the DOM to see how it works.</p>
</body>

</html>

app.js（从app.ts编译后）

requirejs.config({
    baseUrl: ".",
    paths: {
        "jquery": "https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"
        "slick": "https://cdn.jsdelivr.net/jquery.slick/1.6.0/slick.min.js"
    },
    shim: {
        'jquery': {
            exports: '$'
        }
        'slick': {
            deps: ['jquery'],
            exports: '$.fn.slick'
        }
    }
});

requirejs(["jquery", "slick"], function($) {

    // Code within this function will only execute
    // once jQuery and Slick have been loaded.
    //
    // The configuration above ensures jQuery will always 
    // be loaded before slick.

    $.slick();

});

RequireJS documentation在how to use with jQuery

上有一整节

Answer 2

您将需要声明$。您可以使用declare var $: any;

declare var $: any;
class Splash {
    init() {
        $.slick();
    }
}

它不会再给您错误了：）。

使用带打字稿的光滑轮播

2 个答案: