Node.js Laravel和引导图示符图标-文件复制到哪里，如何设置相对路径以及如何解决缓存破坏？

我很难理解如何在laravel 5.4中使用glyphicons

我有以下问题：

1） 当我运行“npm run dev”时，glyphicon文件被复制到public/font/vendor/bootstrap sass/bootstrap。这在哪里发生？我可以改变路径吗？我没有在我的网页中明确配置：

const { mix } = require('laravel-mix');
mix.js('resources/assets/js/app.js', 'public/js')
    .sass('resources/assets/sass/app.scss', 'public/css');

2） 如果我想在css中链接前面提到的图标，我会在my_variables.scs中添加以下行：

$icon-font-path: "/fonts/vendor/bootstrap-sass/bootstrap/";

但问题是我的浏览器找不到资源：

GET https://localhost/fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.woff2 net::ERR_ABORTED

这是因为资源确实位于：

https://localhost/MYAPP/PUBLIC/fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.woff2

如何使scss中的路径相对

3） 当我将glypicon文件移动到localhost/font只是为了测试它是否有效时。但在我将缓存破坏添加到网页包后，它又停止了工作

mix.js('resources/assets/js/app.js', 'public/js')
    .sass('resources/assets/sass/app.scss', 'public/css')
    .version();

。。。这是因为css中的glypgicon文件也有版本控制：

src: url(/fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.eot?f4769f9bdb7466be65088239c12046d1);

---

但实际上，它没有版本控制。如何解决此问题？

因为您的应用程序位于目录到目录（）中。您可以删除

\u variables.scss

上的斜杠，因此：

$icon-font-path: "/fonts/vendor/bootstrap-sass/bootstrap/";

你可以试试这个：

$icon-font-path: "fonts/vendor/bootstrap-sass/bootstrap/";

您可以编辑指向

public

目录的应用程序虚拟主机，并将URL添加到

hosts

文件中

您也可以尝试使用比npm更快的默认混合。这将导致最终CSS具有

url（/font/vendor/bootstrap sass/…）

，但该url是绝对的，因此

font

目录应位于Web服务器的根目录

• 作为第一个选项，最好将您的Web服务器配置为将

  public

  目录作为文档根目录提供服务。这是特定于Web服务器的配置（Apache、nginx…）。或者，更好的是，如果您可以使用它（对于Mac，对于Linux）

• 或者，在应用程序公用文件夹中设置资源根路径：

  mix.setResourceRoot('/MYAPP/public/')
  

• 最后，您可以将字体文件放在

  public/fonts

  目录中：

  $icon-font-path: "../fonts/bootstrap/";
  

  及

---

尝试删除斜杠，但npm run dev无法工作，因为我发现：未找到这些相关模块：./font/vendor/bootstrap-sass/bootstrap-pglyphicons-halflings-regular.woff2 in./~/css-loader？{“url”：true，“sourceMap”：false}/~/postcss加载程序？{“sourceMap”：false}/~/解析url加载器/~/sass-loader/lib/loader.js？{“precision”：8，“outputStyle”：“expanded”，“sour-ceMap”：true}/资源/资产/sass/app.scss

mix.options({ processCssUrls: false })
  .copy('node_modules/bootstrap-sass/assets/fonts', 'public/fonts')