FontAwesome修改默认前缀问题：设为Regular仍需加far前缀

嘿，我来帮你搞定这个默认前缀的问题！你想让Font Awesome默认使用Regular样式（也就是far前缀），但目前设置后还是得手动加far才能生效，对吧？这大概率是配置时没正确覆盖默认的前缀设置，我给你一步步说怎么改：

核心配置步骤（以Vue项目为例） #

你需要在项目入口文件（比如main.js）里做这几个关键设置：

1. 导入必要的模块和Regular图标
   首先要确保你导入的是free-regular-svg-icons里的图标，而不是默认的solid版：

   import { library, config } from '@fortawesome/fontawesome-svg-core'
   // 导入你需要的Regular图标
   import { faUser, faEnvelope, faBell } from '@fortawesome/free-regular-svg-icons'
   import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
   

2. 设置默认前缀为far
   通过fontawesome-svg-core的config对象来修改默认前缀：

   // 把默认前缀改成far（Regular）
   config.defaultPrefix = 'far'
   

3. 将图标添加到库并注册组件
   把导入的Regular图标添加到Font Awesome的library里，再全局注册组件：

   library.add(faUser, faEnvelope, faBell)
   Vue.component('font-awesome-icon', FontAwesomeIcon)
   

模板里的使用方式 #

配置完之后，你在模板里直接写图标名称就会默认用Regular样式了：

<!-- 不用加far前缀，直接显示Regular版的user图标 -->
<font-awesome-icon icon="user" />

如果偶尔需要用Solid样式的图标，只需要手动指定prefix就行：

<!-- 手动指定fas前缀，显示Solid版的user图标 -->
<font-awesome-icon icon="user" prefix="fas" />

为什么之前的设置没生效？ #

大概率是这两个原因：

• 你没设置config.defaultPrefix = 'far'，默认前缀还是fas（Solid），所以必须加far才能调用Regular图标
• 你导入的还是Solid版的图标（@fortawesome/free-solid-svg-icons），而不是Regular版的，导致库里面没有Regular图标，加了前缀才会去加载

试一下上面的配置，应该就能让默认前缀变成Regular啦！要是还有问题，检查一下是不是图标没正确导入到library里，或者有没有其他地方覆盖了默认配置~

内容的提问来源于stack exchange，提问作者 Kimaya