如何使用 Aurelia-CLI 和 RequireJS 添加 CDN答案

【问题标题】：How to add CDN with Aurelia-CLI and RequireJS如何使用 Aurelia-CLI 和 RequireJS 添加 CDN
【发布时间】：2016-12-19 19:00:31
【问题描述】：

我正在尝试添加只能通过 CDN 获得的第 3 方扩展。如何将它们添加到 Aurelia-CLI 和/或 Aurelia WebPack 项目中？

我正在使用的库是 DataTables，我通过添加以下内容修改 aurelia.json 文件使其与 Aurelia-CLI 一起使用：

{
  "name": "datatables",
  "path": "../node_modules/datatables/media",
  "main": "js/jquery.dataTables",
  "deps": ["jquery"],
  "exports": "$",
  "resources": [
    "css/jquery.dataTables.css"
  ]
},

然后在我的 ViewModel 中

import $ from 'jquery';
import dataTable from 'datatables';

export class DataTableViewModel { 
  activate() {
      //bind your data here
  }
  attached() {
      $('#example').DataTable();
  }
}

但我现在面临的问题是添加样式扩展（DataTables Bootstrap 4 theme）。

我尝试在index.html 中添加CDN，即使没有出现任何错误，它似乎也不起作用。

<body aurelia-app="main">
  <script src="scripts/vendor-bundle.js" data-main="aurelia-bootstrapper"></script>
    <script type="text/javascript" language="javascript" src="https://cdn.datatables.net/1.10.13/js/dataTables.bootstrap4.min.js">
    </script>
</body>

我还尝试通过在paths 中添加CDN 然后在deps 中使用它来将它添加到aurelia.json 配置文件中，但这似乎也不起作用。

"paths": {
    "root": "src",
    "resources": "src/resources",
    "elements": "src/resources/elements",
    "attributes": "src/resources/attributes",
    "valueConverters": "src/resources/value-converters",
    "bindingBehaviors": "src/resources/binding-behaviors",
    "dataTablesBootstrap4": ["//cdn.datatables.net/1.10.13/js/dataTables.bootstrap4.min.js"]
  },
...
{
  "name": "datatables",
  "path": "../node_modules/datatables/media",
  "main": "js/jquery.dataTables",
  "deps": ["jquery", "dataTablesBootstrap4"],
  "exports": "$",
  "resources": [
    "css/jquery.dataTables.css"
  ]
},

有什么建议吗？

编辑

我刚刚发现了这个Aurelia-CLIissue #313，这可能是相关的，可能意味着目前没有办法导入CDN。

【问题讨论】：

标签： requirejs cdn aurelia

【解决方案1】：

因为包不会被延迟加载并且无论如何都集中到同一个包中，您只需将 CDN 脚本添加到您的 index.html 文件中即可实现相同的目的。或者，您可以根据需要将脚本插入到需要它的页面中（有点假装延迟加载）。

【讨论】：

感谢 Dwayne，我认为这是不可能的，但也许我没有正确尝试。但是，这样做不是进入全局变量吗？没有办法像import 那样通过将它们添加到index.html 中，对吗？