Question

我买了一个html / css主题，它使用了这个包：

https://github.com/feathericons/feather

运行npm install feather-icons --save-dev时，我将其安装在node_modules下：

内部图标/仅是.svg文件/图标

我不知道这个主题的卖方是如何从该软件包中的public / fonts / feather文件夹下创建此文件结构的？？

是否有某种工具可以从该npm包中生成这些文件？或者什么？

Answer 1

主题作者所做的是正确的。因为当图标链接到NPM存储库时可以更新它。顺便说一下，按照将图标添加到项目中的步骤进行操作。

在feather.replace()文件中添加app.js方法。（如果您使用默认的Laravel Mix结构）
将生成的文件链接到您的布局或页面，默认情况下应将其存储在public/js中，以便脚本标签看起来像（假设您在Laravel Blade中使用它）

<script src="{{ asset('js/app.js') }}"></script>

在标记中添加所需的图标

<h1><i data-feather="circle"></i>Hello World</h1>

它应该工作正常。或者，您也可以通过链接到CDN来直接使用。

<!DOCTYPE html>
<html lang="en">
  <title></title>
  <script src="https://unpkg.com/feather-icons"></script>
  <body>

    <!-- example icon -->
    <i data-feather="circle"></i>

    <script>
      feather.replace()
    </script>
  </body>
</html>

或者，您可以使用mix.copy或mix.copyDirectory从节点模块进行复制。例如

mix.copyDirectory('node_modules/feather-icons', 'public/icons');

PS：有关更多信息，https://laravel.com/docs/5.8/mix

如何将feather-icons编译为css文件？

1 个答案: