一、build文件下utils.js下增加

publicPath:'../../'

二、

同样的代码环境,用yarn来安装依赖后启动运行正常,而采用npm安装依赖则有类似问题。当然,这个和yarn或者npm没有关系,肯定是环境配置的问题。经过对比发现,用yarn安装依赖后,运行的页面加载的字体文件并不是一个http请求,而是把字体文件打包成了Base64编码的文件直接嵌入到了页面当中,而采用npm搭建的环境,则发起了一个http请求,并指向了错误的地址。

这样以来就初步定位了问题,排查webpack.base.conf.js,对应的字体模块加载配置

由于设置了limit:10000,即文件大于10KB就会直接发起http请求的方式去加载依赖,而小于10KB的文件则直接通过Base64打包嵌入到页面当中,调整该配置为100000,再次打包测试,字体图标显示正常了,初步确定,问题就在这里。虽然问题定位了,但是原因还没找到,由于采用的webpack配置是同一份,不可能出现yarn和npm安装依赖导致配置的改变,再次分析发现,npm安装搭建的环境,请求的woff文件和ttf文件,显著变大了,分别为55956B和28200B,而通过yarn搭建的环境请求的对应字体文件只有11040B和6164B,文件大小明显不同,差异巨大。

vue 升级element-ui woff文件404的更多相关文章

  1. vue+ elementUI 打包发布到服务器后,element-icons.woff文件404

    vue项目打包部署到服务器,静态资源文件404 js文件404问题        原因:打包的项目静态资源的路径需要设置为绝对路径.如果是相对路径会出错 解决办法:修改config/index.js文 ...

  2. 关于vue.js element ui 表单验证 this.$refs[formName].validate()的问题

        方法使用前需了解: 来自”和“小编的小提示: 首先打印一下this.$refs[formName],检查是否拿到了正确的需要验证的form. 其次在拿到了正确的form后,检查该form上添加 ...

  3. vue开源Element UI表单设计及代码生成器

    在日常的开发工作中,表单开发是较为繁琐且重复的.本文介绍一个我自己写的,提高开发效率的小工具. 1 可视化设计器 设计器基于Element UI ,可通过点击或拖拽的方式设计基本表单, 设计器生成的代 ...

  4. Vue框架Element UI教程-axios请求数据

    Element UI手册:https://cloud.tencent.com/developer/doc/1270 中文文档:http://element-cn.eleme.io/#/zh-CN gi ...

  5. vue与element ui的el-checkbox的坑

    一,场景 通过使用checkbox,实现如图的场景, 点击某个tag,实现选中和非选中状态. 二, 官网的例子 通过切换checked值为true或者false来实现,一个checkbox的状态切换 ...

  6. vue.js+element ui Table+spring boot增删改查

    小白初学,不懂的还是太多了,找了好多资料才做出来的先记录一下 1.先用Spring boot创建一个包含了增删改查的项目 2.创建vue.js项目 3.安装Element UI (1)进入项目文件夹下 ...

  7. 第五十三篇:Vue安装Element ui

    好家伙,之前写的一篇过时了,用不了了,更新一波 (已新建一个vue项目) 1. 在项目目录下执行:npm i element-ui -S 2. 在main.js中写入 import ElementUI ...

  8. VUE -- 对 Element UI table中数据进行二次处理

    时间——日期 后台经常给我们返回的是 时间戳 (例如:1535620671) 这时候我们页面展现的时候需要将时间戳转换为我们要的格式 例如 (YYYY-MM-DD HH:mm:ss) 如果是在Elem ...

  9. Vue.js + Element.ui 从搭建环境到打包部署

    一.搭建环境 由于新的node已经集成了npm,所以直接安装node,前往node官网下载最新版本的node,根据自己的操作系统选择相应的包,按照步骤一步步走就可以,这里不做过多介绍. 安装好后可以打 ...

随机推荐

  1. python 携程asyncio实现高并发示例1

    import asyncio #携程(携程不是函数) async def print_hello(): while True: print("hello world") await ...

  2. JDK14的新特性:Lombok的终结者record

    目录 简介 新的Record类型 探讨Record的秘密 record扩展 总结 JDK 14的新特性:Lombok的终结者record 简介 自从面向对象产生之后,程序界就开始了新的变化,先是C发展 ...

  3. java内存模型(JMM)和happens-before

    目录 重排序 Happens-Before 安全发布 初始化安全性 java内存模型(JMM)和happens-before 我们知道java程序是运行在JVM中的,而JVM就是构建在内存上的虚拟机, ...

  4. Spring Boot JPA的查询语句

    文章目录 准备工作 Containing, Contains, IsContaining 和 Like StartsWith EndsWith 大小写不敏感 Not @Query Spring Boo ...

  5. 使用spring boot创建fat jar APP

    文章目录 介绍 build和run fat jar和 fat war 更多配置 介绍 在很久很很久以前,我们部署web程序的方式是怎么样的呢?配置好服务器,将自己写的应用程序打包成war包,扔进服务器 ...

  6. 【ejabberd】安装XMPP服务器ejabberd(Ubuntu 12.04)

    ejabberd ejabberd is a free and open source instant messaging server written in Erlang/OTP. ejabberd ...

  7. extend()和append()区别

    extend()和append()都可以用来添加. 例: a = [1,2,3,4,5,6] b = [7,8,9,10] c = {'aa':123,'bb':456,'cc':789} 1.    ...

  8. 关于利用注射点判断数据库web是否分离

    得到客户端主机名:select host_name();得到服务端主机名: select @@servername; 本文转hackfreer51CTO博客,原文链接:http://blog.51ct ...

  9. Linux 搭建nginx的PID

    pid logs/nginx.pid 安装的时候就是没有,其实在启动 nginx 时自动生成的 里面存放的是 当前 nginx 住进程的 ID 号:所以在配置文件中指定pidpid /usr/loca ...

  10. Java 类类型之 String 类型

    类类型 引用数据类型存的都是地址,通过地址指向对象: 基本数据类型存的都是具体值: 字符串 (String) 类型 特点: 1.字符创都是对象: 2.一旦初始化,不能被更改,字符串缓冲区支持可变的字符 ...