Aurelia CLI包括Bootstrap Glyphicons [英] Aurelia CLI include Bootstrap Glyphicons

问题描述

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

I'm trying to include Bootstrap in my Aurelia CLI project, and the CSS and JS work fine.

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

The only problem I have is the glyphicons require font files to be loaded.

我使用以下配置:

"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"
        ]
    }
]

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

But I get an error containing this line:

路径:"C:\ Users \ randy \ Documents \ form \ node_modules \ bootstrap \ dist \ fonts \ glyphicons-halflings-regular.js"

path: 'C:\Users\randy\Documents\form\node_modules\bootstrap\dist\fonts\glyphicons-halflings-regular.js'

因此，即使我包含了.woff2文件，Aurelia也会尝试将该文件导入为JS文件.我该怎么做才能使这项工作? CSS确实可以正常工作.

So even though I include the .woff2 file, Aurelia tries to import the file as a JS file. What can I do to make this work? CSS does work fine.

推荐答案

此问题已解决，有关更多信息，请阅读 Github问题.

This has been solved, for more information read the Github issue.

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

This issue can now be solved by adding a copy instruction in the aurelia.json.

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

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

Add the following in the build block:

"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版本创建的，则必须在任务文件夹中创建复制任务

---

If the project was created by an older CLI version, you will have to create the copy task inside the tasks folder

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

然后，在build.js/ts任务中调用复制任务

After that, call the copy task in the build.js/ts task

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

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

* credits to fabioluz for commenting this on github

这篇关于Aurelia CLI包括Bootstrap Glyphicons的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！