在我的打字稿文件中正确引用 (javascript) jquery 插件

Question

我想在我的Aurelia SPA 的打字稿页面中使用 jquery 插件。这个插件叫morelines

这是我目前的解决方案：

我的打字稿文件：post.ts

import './jquery.morelines'
export class Post {
    attached() {
            $('.card__description--details').moreLines({
                linecount: 6,
                baseclass: 'b-description',
                basejsclass: 'js-description',
                classspecific: '_readmore',
                buttontxtmore: "",
                buttontxtless: "",
                animationspeed: 400
            });
    }
}

插件jquery.morelines.js

Code visible here on github

(function ( $ ) {
    $.fn.moreLines = function (options) {
      ...
    }
 }(jQuery));

我的 tsconfig.json

{
  "compileOnSave": false,
  "compilerOptions": {
    "sourceMap": true,
    "target": "es5",
    "module": "amd",
    "declaration": false,
    "noImplicitAny": false,
    "removeComments": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "allowJs": true,
    "moduleResolution": "node",
    "lib": ["es2017", "dom"],
    "baseUrl": "src"
  },
  "include": [
    "./src/**/*.ts",
    "./test/**/*.ts"
  ],
  "atom": {
    "rewriteTsconfig": false
  }
}

它在运行时有效，但在捆绑时出现错误 (au build)

如何摆脱这些错误？如何在我的打字稿文件中正确引用这个 javascript jquery 插件？

Answer 1

好的，我只需添加对我的 jquery 插件的引用，如下所示：

aurelia.json

"dependencies": [
    ...
    ...
    {
        "name": "jquery.morelines",
        "path": "../javascript",
        "main": "jquery.morelines",
        "deps": [
          "jquery"
        ]
    }
]

无需在我的打字稿页面中添加任何import。

posts.ts

    ...
    (<any>$('.card__description--details')).moreLines({
      linecount: 6,
      baseclass: 'b-description',
      basejsclass: 'js-description',
      classspecific: '_readmore',
      buttontxtmore: "",
      buttontxtless: "",
      animationspeed: 400
    });