zoukankan      html  css  js  c++  java
  • vue 升级element-ui woff文件404

    一、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,文件大小明显不同,差异巨大。

  • 相关阅读:
    0-1性能测试需求分析
    1-10jmeter关联,正则表达式(待巩固)
    1-9jmeter集合点,并发操作
    1-8.jmeter设置断言(检查点)
    1-6jmeter性能测试基础
    泛型中的协变和逆变
    jsPlumb
    jQuery UI vs Kendo UI & jQuery Mobile vs Kendo UI Mobile
    31天重构
    Visual Studio 小工具
  • 原文地址:https://www.cnblogs.com/baiyq/p/11858962.html
Copyright © 2011-2022 走看看