如何添加第三方JQuery'；js'；文件到aurelia typescript导航框架

我有一个基于

Aurelia导航框架typescript

template（）的简单Aurelia应用程序，我正试图让它接受Creative Tim Material dashboard（）中的Material-dashboard.js文件，但运气不好

如果我在index.html中引用此项，则lib在加载时将不会被接受，因为我得到一个错误：

Uncaught ReferenceError: $ is not defined
    at material-dashboard.js:38
    at material-dashboard.js:46

我猜这意味着这个文件依赖于JQuery，而JQuery没有及时加载

我还尝试将其添加到我的config.js中

"material-dashboard:src/material-dashboard": {
  "jquery": "npm:jquery@2.2.4"
},

直接指向它的源代码和bundles.js

"dist/aurelia": {
    "includes" : [ ..., "material-dashboard", ...]
}

"dist/aurelia": {
    "includes" : [ ...,"material", "material-dashboard", ...]
}

引用main.js是否与bootstrap类似

import 'material-bootstrap';

但这只是踢出了另一个错误

system.src.js:1041
GET http://localhost:9000/dist/material-dashboard.js 404 (Not Found)
    W @ system.src.js:1041
    (anonymous) @ system.src.js:1777
    e._execute @ bluebird.min.js:31
    i._resolveFromExecutor @ bluebird.min.js:32
    i @ bluebird.min.js:32
    (anonymous) @ system.src.js:1776
    (anonymous) @ system.src.js:2801
    (anonymous) @ system.src.js:3379
    (anonymous) @ system.src.js:3711
    (anonymous) @ system.src.js:4103
    (anonymous) @ system.src.js:4568
    (anonymous) @ system.src.js:4837
    (anonymous) @ system.src.js:408
    r @ bluebird.min.js:33
    i._settlePromiseFromHandler @ bluebird.min.js:32
    i._settlePromise @ bluebird.min.js:32
    i._settlePromise0 @ bluebird.min.js:32
    i._settlePromises @ bluebird.min.js:32
    r._drainQueue @ bluebird.min.js:31
    r._drainQueues @ bluebird.min.js:31
    drainQueues @ bluebird.min.js:31

bluebird.min.js:33 
Error: (SystemJS) XHR error (404 Not Found) loading http://localhost:9000/dist/material-dashboard.js
    Error: XHR error (404 Not Found) loading http://localhost:9000/dist/material-dashboard.js
    Error loading http://localhost:9000/dist/material-dashboard.js as "material-dashboard" from http://localhost:9000/dist/main.js

---

知道如何解决/理解这个问题吗？

在aurelia文档中，您可以找到bootstrap如何使用jquery，在aurelia.json中添加了以下内容：

"dependencies": [
  {
    "name":"jquery",
    "path":"../node_modules/jquery/dist",
    "main":"jquery.min",
    "export": "$"
  },
  {
      "name": "bootstrap",
      "path": "../node_modules/bootstrap/dist",
      "main": "js/bootstrap.min",
      "deps": ["jquery"],
      "resources": [
        "css/bootstrap.css"
      ]
  }

特别注意“export”：“$”和“deps”：[“jquery”]。我想你也需要类似的东西

---

我希望这能有所帮助。

我就是这样让它工作的：

config.js

"material-dashboard:src/material-dashboard": {
  "jquery": "npm:jquery@2.2.4"
},

"material": "/assets/js/material.min.js",
"material-dashboard": "/assets/js/material-dashboard.js"

bundles.js

"dist/aurelia": {
    "includes" : [ ..., "material-dashboard", ...]
}

"dist/aurelia": {
    "includes" : [ ...,"material", "material-dashboard", ...]
}

main.js

import 'material';
import 'material-bootstrap';

---

哪一个最终起作用了

gulpwatch

可能在

dist

中，它都被编译到一个包中，因此

material dashboard.js

不可用？它需要以与引导相同的方式导入到项目中-因此需要包含在main.js文件中。你是如何安装这个软件包的？