Angular CLI 将 font-awesome 字体文件输出到 dist 根目录 [英] Angular CLI outputs the font-awesome font files the dist root

问题描述

您是否必须eject angular-cli 并覆盖webpack 配置才能将font-awesome 字体放入assets/fonts 文件夹?我有这个 angular-cli 并且我以这种方式在我的 angular-cli.json 中包含了 font-awesome:

Do you have to eject your angular-cli and override the webpack configuration in order to place the font-awesome fonts into the assets/fonts folder? I have this angular-cli and I include the font-awesome this way in my angular-cli.json:

"styles": [
        "styles.css",
        "../node_modules/bootstrap/dist/css/bootstrap.min.css",
        "../node_modules/font-awesome/css/font-awesome.min.css"
      ],

但是当我执行 ng build --prod 时，我可以正确构建所有内容，但是所有字体很棒的字体都位于根目录中(styles.css 所在的位置).

but when I do ng build --prod I get everything built correctly however all font-awesome fonts are located in the root (where the styles.css is).

你可以通过 angular-cli.json 来配置还是必须通过 packages.json 中的脚本来配置?

Can you configure this through angular-cli.json or do you have to do it via scripting in the packages.json?

看资产管理的wiki(https://github.com/angular/angular-cli/wiki/stories-asset-configuration)，我试过这个:

Looking at the wiki for assets management (https://github.com/angular/angular-cli/wiki/stories-asset-configuration), I tried this:

  "assets": [
    { "glob": "**/*", "input": "./assets/", "output": "./assets/" },
    { "glob": "favicon.ico", "input": "./", "output": "./" },
    { "glob": "**/*", "input": "../node_modules/font-awesome/fonts/*", "output": "./assets/fonts/" }
  ]

但这没有用.

更新:

貌似不可能?--> https://github.com/angular/angular-cli/issues/6637

推荐答案

我想你只是关注了 http://github.com/angular/angular-cli/blob/master/docs/documentation/stories/include-font-awesome.md 在 ng serve/build 期间，一旦 cli 看到您引用了 font-awesome，它只是将字体文件复制到根目录中.

I think you just followed http://github.com/angular/angular-cli/blob/master/docs/documentation/stories/include-font-awesome.md during ng serve/build once cli seeing you referencing the font-awesome it is just copying the fonts files like it is in to the root.

似乎是类似的问题 如何在 angular4 中构建时将所有字形放在一个文件夹中? angular cli 只是以这种方式处理 font-awesome.css 引用的字体，所以它只是影响客户端浏览器不关心的 output/dist 文件夹，所以它不应该受到伤害.

Seems like it is similar issue How can i place all the glyphicons to one folder while building in angular4? angular cli just handling the fonts referenced by font-awesome.css this way so it is just affecting the output/dist folder that client browser does not care about so it is should not hurt.

这篇关于Angular CLI 将 font-awesome 字体文件输出到 dist 根目录的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！