广告
返回顶部
首页 > 资讯 > 前端开发 > html >如何解决vue项目使用font-awesome,build后路径的问题
  • 524
分享到

如何解决vue项目使用font-awesome,build后路径的问题

2024-04-02 19:04:59 524人浏览 八月长安
摘要

这篇文章主要介绍如何解决Vue项目使用font-awesome,build后路径的问题,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!问题: 项目在本地run情况下显示正常,在buil

这篇文章主要介绍如何解决Vue项目使用font-awesome,build后路径的问题,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!

问题:

项目在本地run情况下显示正常,在build后font-awesome的CSS文件依赖的几个图标文件引用路径报错。

如何解决vue项目使用font-awesome,build后路径的问题

在webpack.base.conf.js中关于几个文件的配置如下:

{
 test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
 loader: 'url-loader',
 options: {
  limit: 10000,
  name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
  }
}

解决:

通过和网上其他大神的配置对比上发现,有些webpack.base.conf.js的配置如下:

{
 test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
 loader: 'url-loader'
}

将配置中option注释掉即可解决路径问题。

后续:

这个方式是个治标的方式,不是问题的关键,关键应该在脚手架的其他配置上。

以上是“如何解决vue项目使用font-awesome,build后路径的问题”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注编程网html频道!

--结束END--

本文标题: 如何解决vue项目使用font-awesome,build后路径的问题

本文链接: https://www.lsjlt.com/news/74381.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • 如何解决vue项目使用font-awesome,build后路径的问题
    这篇文章主要介绍如何解决vue项目使用font-awesome,build后路径的问题,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!问题: 项目在本地run情况下显示正常,在buil...
    99+
    2022-10-19
  • 如何解决vue-cli项目webpack打包后iconfont文件路径的问题
    这篇文章主要介绍了如何解决vue-cli项目webpack打包后iconfont文件路径的问题,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。...
    99+
    2022-10-19
  • 如何解决vue项目打包后提示图片文件路径错误的问题
    这篇文章主要介绍如何解决vue项目打包后提示图片文件路径错误的问题,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!vue项目打包后在production模式下提示图片 ‘404(not...
    99+
    2022-10-19
  • vue项目中使用axios遇到的相对路径和绝对路径问题怎么解决
    这篇文章主要讲解了“vue项目中使用axios遇到的相对路径和绝对路径问题怎么解决”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“vue项目中使用axios遇到的相对路径和绝对路径问题怎么解决...
    99+
    2023-06-30
  • 解决vue项目路径不正确,自动跳转404的问题
    目录vue项目路径不正确,自动跳转404第一种方法第二种vue路由判断跳转404页面vue项目路径不正确,自动跳转404 第一种方法 使用vuerouter钩子函数beforeEac...
    99+
    2022-11-13
  • vue项目中使用axios遇到的相对路径和绝对路径问题
    目录使用axios遇到的相对路径和绝对路径问题1.设置全局baseURL2.覆盖baseURLaxios设置访问基础路径在main.js 做如下配置可能会遇到下面的报错使用axios...
    99+
    2022-11-13
  • 如何解决vue打包项目后刷新404的问题
    这篇文章主要介绍了如何解决vue打包项目后刷新404的问题,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。vue打包项目后刷新404的问题Ng...
    99+
    2022-10-19
  • vue-cli项目打包后运行文件路径报错如何解决
    今天小编给大家分享一下vue-cli项目打包后运行文件路径报错如何解决的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。问题:刚...
    99+
    2023-07-04
  • Vue打包后相对路径的引用问题怎么解决
    这篇“Vue打包后相对路径的引用问题怎么解决”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“Vue打包后相对路径的引用问题怎么...
    99+
    2023-06-30
  • 如何解决vue-cli项目打包出现空白页和路径错误的问题
    这篇文章主要介绍了如何解决vue-cli项目打包出现空白页和路径错误的问题,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。vue-cli项目打...
    99+
    2022-10-19
  • webpack-url-loader如何解决项目中图片打包路径问题
    这篇文章给大家分享的是有关webpack-url-loader如何解决项目中图片打包路径问题的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。刚开始用webpack的同学很容易掉进图...
    99+
    2022-10-19
  • 如何解决vue项目打包后文件过大问题
    目录为什么打包后文件过大?如何快速解决1.路由懒加载【使用es6提案的import()方式】2.CDN引入为什么打包后文件过大? 移动app项目,使用vue-cli脚手架搭建,UI主...
    99+
    2022-11-13
  • 如何解决Vue背景图打包之后访问路径错误的问题
    这篇文章主要介绍如何解决Vue背景图打包之后访问路径错误的问题,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!案例环境通过vue-cli脚手架创建的vue项目在项目打包的时候遇到了背景...
    99+
    2022-10-19
  • vue项目打包后浏览器缓存问题如何解决
    本篇内容主要讲解“vue项目打包后浏览器缓存问题如何解决”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“vue项目打包后浏览器缓存问题如何解决”吧!vue项目打包后浏览器缓存第一步需要在index...
    99+
    2023-07-05
  • 如何解决vue build打包之后首页白屏的问题
    这篇文章主要为大家展示了“如何解决vue build打包之后首页白屏的问题”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“如何解决vue build打包之后首页白...
    99+
    2022-10-19
  • 如何解决Vue项目编译后部署在非网站根目录的问题
    小编给大家分享一下如何解决Vue项目编译后部署在非网站根目录的问题,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!同一个生产部署项...
    99+
    2022-10-19
  • 如何使用 PHP 和 JavaScript API 解决路径问题?
    在开发 Web 应用程序时,路径问题是一个常见的问题。路径问题通常是由于不同操作系统、不同 Web 服务器和不同的文件系统之间的差异引起的。在本文中,我们将介绍如何使用 PHP 和 JavaScript API 解决路径问题。 PHP 路...
    99+
    2023-11-10
    api javascript path
  • 如何解决将three项目迁移至vue项目遇到的问题
    这篇文章主要介绍了如何解决将three项目迁移至vue项目遇到的问题,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。通过npm下载的three依赖无法正常使用在原项目中使用的是...
    99+
    2023-06-28
  • 如何解决Vue编译时写在style中的路径问题
    这篇文章将为大家详细讲解有关如何解决Vue编译时写在style中的路径问题,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。写在vue文件里面的style样式,在添加例如背景...
    99+
    2022-10-19
  • Vue项目中使用addRoutes出现问题的解决方法
    目录前言 一、404页面 1. 出现的原因 2. 解决方案 二、刷新白屏 1. 出现原因 2. 解决方案 三、路由重复 1.  出现原因 2. 解决方案 总结前言 add...
    99+
    2022-11-12
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作