Question

我试图在我的Aurelia CLI项目中包含Bootstrap，并且CSS和JS工作正常。

我唯一的问题是glyphicons需要加载字体文件。

我使用此配置：

"dependencies": [
    {
        "name": "bootstrap",
        "path": "../node_modules/bootstrap/dist",
        "main": "js/bootstrap.min",
        "deps": ["jquery"],
        "exports": "$",
        "resources": [
          "css/bootstrap.min.css",
          "fonts/glyphicons-halflings-regular.woff2"
        ]
    }
]

但是我收到包含此行的错误：

路径：＆＃39; C：\ Users \ randy \ Documents \ form \ node_modules \ bootstrap \ dist \ fonts \ glyphicons-halflings-regular.js＆＃39;

因此即使我包含.woff2文件，Aurelia也会尝试将该文件作为JS文件导入。我能做些什么来完成这项工作？ CSS确实可以正常工作。

Answer 1

看起来这是Aurelia CLI当前版本中的一个错误。我在这里为您提交了一个问题：https://github.com/aurelia/cli/issues/248

Answer 2

Aurelia无法处理字体文件。您必须使用手动捆绑任务。

以下是font-awesome的类似解决方案：https://stackoverflow.com/a/39544587/1276632

这是glyphicons的解决方案（我用它来进行bootstrap v4集成）：https://github.com/aurelia/cli/issues/248#issuecomment-250967074

Answer 3

这已经解决了，有关更多信息，请阅读Github issue。

现在可以通过在 aurelia.json 中添加复制指令来解决此问题。

aurelia.json - 如果项目是由aurelia-cli 0.25.0或更高版本创建的，则有效

在构建块中添加以下内容：

"bundles": [ ... ], 
"copyFiles": {
  "node_modules/bootstrap/dist/fonts/glyphicons-halflings-regular.woff2": "bootstrap/fonts",
  "node_modules/bootstrap/dist/fonts/glyphicons-halflings-regular.woff":  "bootstrap/fonts",
  "node_modules/bootstrap/dist/fonts/glyphicons-halflings-regular.ttf":   "bootstrap/fonts"
}

如果项目是由较旧的CLI版本创建的，则必须在任务文件夹中创建复制任务

https://github.com/aurelia/cli/blob/master/lib/resources/tasks/copy-files.js。

之后，调用build.js / ts任务中的复制任务

https://github.com/aurelia/cli/blob/master/lib/resources/tasks/build.js#L15

* 归功于fabioluz，以便在github上发表评论

Aurelia CLI包括Bootstrap Glyphicons

3 个答案: