如何添加第三方JQuery'js'文件到aurelia打字稿导航框架

我有简单的Aurelia应用程序基于aurelia navigation skeleton-typescript模板（https://github.com/aurelia/skeleton-navigation/tree/master/skeleton-typescript），我试图让它接受来自Creative Tim材料仪表板的materia-dashboard.js文件https://github.com/creativetimofficial/material-dashboard）没有运气。如何添加第三方JQuery'js'文件到aurelia打字稿导航框架

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

我猜意味着该文件有未在加载jQuery的依赖性：

如果我引用这个index.html中，LIB就不会被加载时，我得到一个错误接受时间。

我自己也尝试加入这个我config.js

"material-dashboard:src/material-dashboard": { 
    "jquery": "npm:[email protected]" 
},

只是指出它直接到它的来源以及对bundles.js

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

，并引用是main.js像引导

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

任何想法如何解决/明白这一点？

来源

2017-06-01 vidriduch

也许在'dist'这一切被编译成一个包，所以'材料dashboard.js'不可用？ –

它需要以与Bootstrap相同的方式导入到您的项目中 - 因此它需要包含在main.js文件中。你是怎么安装软件包的？ – Tom

在奥里利亚文档中，你可以找到引导如何使用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" 
     ] 
    }

启事：“$”和“DEPS”： [ “的jquery”]。我想为兑现你需要类似的

我希望这有助于一些。

来源

2017-06-01 16:08:27 Marwijn

这是我得到它的工作：

config.js

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

bundles.js

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

main.js

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

它终于摸索gulp watch

来源

2017-06-05 15:01:01 vidriduch

如何添加第三方JQuery'js'文件到aurelia打字稿导航框架

回答

相关问题