Vue--Module parse failed: Unexpected character '' (1:0) (fonts/element-icons.ttf)

2023-05-16

当Vue引入iview、Element-ui后,npm run dev报错如下图:
在这里插入图片描述
本人项目采用webpack打包工具,由于webpack打包工具是将浏览器不能直接运行的拓展语言(Scss,TypeScript等),将其打包为合适的格式以供浏览器解析,所以.ttf格式的文件未被打包导致浏览器不能解析。所以我们需要webpack去做这件事,也就是在webpack.config.js中module=>rules加上配置规则:

{
        test: /\.(eot|svg|ttf|woff|woff2)(\?\S*)?$/,
        loader: 'file-loader'
}

file-loader 就是将文件(由于一般是图片文件为主,所以下面通常使用图片两字作为替代,方便理解。其他的包括字体文件等),在进行一些处理后(主要是处理文件名和路径),移动打包后的目录中。所以我们package.json当中还需要加入file-loader这个node_modules。加入到dependencies或devDependencies都可以!

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Vue--Module parse failed: Unexpected character '' (1:0) (fonts/element-icons.ttf) 的相关文章

  • Python os.path是ntpath,怎么办?

    谁能告诉我Python如何 别名 os path to ntpath gt gt gt import os path gt gt gt os path
  • 为什么“导入模块”然后“从包导入模块”再次加载模块?

    我的 PYTHONPATH 中有一个包 看起来像这样 package init py module py print Loading module 如果我从以下位置运行 Pythonpackage 目录 或在此目录中写入另一个模块 并输入
  • 如何在magento中添加自定义模块

    您好 我想为页脚创建一个自定义模块 用于显示新闻标题 还没有使用自定义模块 我该怎么做 谁能告诉我创建自定义模块的简单步骤 Thanks 您会发现的最佳资源是 模块创建器扩展 http www magentocommerce com ext
  • Node.js 找不到模块“tcp”

    节点在以下行崩溃 var tcp require tcp 错误文本 node js 201 throw e process nextTick error or error event on first tick Error Cannot f
  • Python导入类型检测

    python 模块可以检测是否已导入import module or from module import 就像是 if something something print Directly imported with import nam
  • 我想要动态加载到入口点的 Webpack 捆绑模块

    下面的代码似乎使用动态导入 https webpack js org guides code splitting dynamic imports function executeApplication void const loadData
  • Python 的“导入”内部是如何工作的?

    当您导入一个模块 然后再次重新导入它时 它会被重新导入 覆盖还是跳过 当您导入模块 a 和 b 并且还在模块 a 中导入模块 b 时 会发生什么 这样做安全吗 例如 如果该模块 b 中有一个实例化的类 您最终会实例化它两次吗 import加
  • 在Windows中启动python时导入模块[重复]

    这个问题在这里已经有答案了 我在 Windows 上使用 python 我正在尝试找到一种在启动 python 时导入一些默认模块的方法 这意味着 当启动python时 一些模块应该已经导入 就像builtins 有什么办法吗 Thanks
  • 如何排除不想要的后代?

    我遇到的情况是元素包含n可点击的手柄和n可揭示的元素 div class revealer div class hotspot a class handle href A a div class reveal p Content A p d
  • magento 付款流程..一般如何运作

    有一个问题 我希望这是问的正确地方 不太明白magento 中的付款方式 客户去结账 假设想要以客人身份付款 因此提供地址等 最后找到付款方式 然后我希望客户通过信用卡付款 已经为我选择的网关 银行 安装了模块 那时 我希望用户被重定向到第
  • GWT:在另一个模块内调用RPC服务

    我有一个模块B 它继承了模块A 当我从A内部调用RPC服务时 它们工作正常 但是当我在B中调用A的服务时 RPC调用总是失败 我错过了什么吗 预先感谢您的任何帮助 我在这里找到了我的问题的答案 http blog cloudglow com
  • 如何覆盖 app/code/core/Mage/Core/functions.php 中的 Magento 函数

    我需要重写此文件中的一个函数 应用程序 代码 核心 Mage Core functions php 问题是 它是如此核心 以至于没有与之关联的类 可能是因为 Core 甚至不是一个模块 有谁知道如何在没有类的情况下覆盖文件中的函数 任何帮助
  • excel vba 将 system.collections.hashmap 导入模块

    从我的内心微软 Excel 2010安装我已经打开了Visual Basic 编辑器 选项卡开发工具 gt Visual Basic 在 的里面Visual Basic 编辑器我右键单击进入项目窗口并创建了一个module 插入 gt 模块
  • 在 Angular 中使用多个模块有什么好处?

    我是 Angular Js 的熟悉者 最近我发现在一些项目中 在主模块中创建并组装了多个 Angular 模块 代码看起来像 angular module main main sub1 main sub2 main sub2 angular
  • 如何在 Perl 脚本中递归查找文件/文件夹?

    我有一个 perl 脚本 我编写了该脚本来递归地搜索 Windows 文件夹中的文件 我输入搜索文本作为 perl 脚本运行时参数 以查找名称中包含此文本的文件 perl脚本如下 use Cwd file1 ARGV 0 res1 glob
  • 导入 python 模块时如何解决 KeyError?

    我试图从不同的目录级别导入模块 所以我使用了 import os import sys sys path insert 0 os path abspath os path join os path dirname file 但现在我收到这个
  • Rails - 将模块包含到控制器中,以在视图中使用

    我对 Rails 很陌生 我尝试设置一个要在视图中使用的模块文件 所以我相信正确的行为是将模块定义为控制器中的助手 瞧 它应该可以工作 然而 对我来说情况并非如此 这是结构 lib functions form manager rb 表单管
  • 如何防止模块被导入两次?

    在编写python模块时 有没有办法防止它被客户端代码导入两次 就像 c c 头文件一样 ifndef XXX define XXX endif 非常感谢 Python 模块不会被多次导入 仅运行两次 import 不会重新加载模块 如果你
  • 如何在 Windows 上的 Python 2.7 上安装 Tensorflow?

    我尝试通过 pip 安装 TensorFlow pip install tensorflow 但是得到这个错误 找不到满足tensorflow要求的版本 来自版本 这个问题有解决办法吗 我还是想通过pip安装 如果您只因为 Keras 而需
  • 指定 gfortran 应该在其中查找模块的目录

    我目前基于模块来编译程序 例如主程序foo这取决于模块bar 如下 gfortran c bar f90 gfortran o foo exe foo f90 bar o 当foo f90 and bar f90位于同一目录中 如何指定 g

随机推荐

  • python和Microsoft Visual C++ Build Tools版本安装

    在windows环境下 xff0c python需要调用Microsoft Visual C 43 43 compiler编译器 xff0c 尤其是在安装第三方包时候 xff0c 会build项目 xff0c 这时如果没有安装或者安装不协调
  • WebSocket 实现数据实时刷新

    WebSocket 是HTML5的一个新协议 xff0c WebSocket 使得客户端和服务器之间的数据交换变得更加简单 xff0c 允许服务端主动向客户端推送数据 在 WebSocket API 中 xff0c 浏览器和服务器只需要完成
  • 计算机毕业设计论文资料查找

    学位论文的材料准备 所谓材料 xff0c 就是为科学研究和论文写作的需要而搜集的一系列事实和事理 撰写学位论文 xff0c 首先要占有丰富的材料 xff0c 这是科研和写作的基础 在这基础上 xff0c 对材料进行加工整理 综合分析 xff
  • 使用VS Code编写、调试和运行C++程序。

    上次提到的是VS Code怎么编写 调试和运行pytho程序 xff0c 这次来说说使用VS Code来对C 43 43 程序操作是怎么个流程和注意哪些问题 环境说明 xff1a Ubuntu18 04 VS Code g 43 43 编译
  • 搭建gitlab

    安装参照 https blog csdn net duyusean article details 80011540 配置的阿里云邮箱 Email Settings gitlab rails 39 gitlab email enabled
  • webrtc系列-kurento相关的一些尝试

    公司最近要做个ICU探视系统 于是在网上找了一个开源的webrtc实现kurentokurento github地址 https github com Kurento kurento media server 下载kurento docke
  • P1080 国王游戏(c++)

    题目 xff1a 题意 xff1a 找出获得最高赏金的大臣 每一个大臣获得的赏金 61 国王的左手 前面所有大臣的左手乘积 自己的右手 于是这里可以自然的想到贪心 xff1a 尽可能让前面所有人的乘积更小 xff0c 而自己的右手又尽可能地
  • 1.1 Qt Creater使用Python开发桌面软件的操作流程

    Qt Creater及Python的下载与安装过程不再赘述 xff0c 读者可自行在网上搜索相应的下载与安装方法 首先我们打开Qt Creater xff0c 单击 Create Project 按钮或单击菜单栏中的 文件 New Proj
  • zootracer使用说明——一款视频物体追踪软件,获取运动物体在屏幕坐标系的运动轨迹

    警告 xff01 软件会使用大量计算机资源 xff0c 请使用配置较高的电脑运行程序 xff01 不然容易把电脑跑坏 xff01 我的配置 xff1a CPU AMD Ryzen 7 5800H with Radeon Graphics G
  • Dockerfile概念简介

    Dockerfile概念简介 前言一 dockerfile概念二 Docker镜像的创建 1 基于现有镜像创建 2 基于本地模板创建 3 基于dockerfile创建 dockerfile结构 xff08 四部分 xff09 构建镜像命令
  • Android:file.mkdirs() false

    如果创建文件目录失败 就要考虑两个原因 1 是否给了读写权限 清单文件有读写权限 但是创建目录之前是否允许了 span class token operator lt span uses span class token operator
  • 【Flutter web】内网网站如何发布?解决外网下canvaskit.js和字体无法加载问题

    背景 由于部署的网站只能在内网下使用 xff0c 部署服务器又不能访问外网 xff0c 导致Flutter web部署遇到很多问题 xff0c 比如 xff1a 白屏 部署的网站为何首次加载缓慢 xff0c 会白屏 xff1f 通过浏览器开
  • 【Flutter web】实现批量生成可下载的二维码,二维码图片点击下载

    这里写自定义目录标题 先看效果 xff1a 方法 xff1a 先看效果 xff1a 方法 xff1a web布局就略过 xff0c 自行练习 xff0c 只讲重点 xff01 此项目需要用到三个依赖库 xff1a zxing2 0 1 0i
  • android 实现类似个人中心的界面设计

    上效果图 xff1a 先理清设计思路 xff1a 1 外层用linearlayout包裹 xff0c linearlayout采用shape 搭上描边 圆角和填充背景色 2 里层采用relativelayout填充进textview ima
  • 上传项目到github并供团队克隆

    github注册就不说了 1 创建仓库 创建后就能在首页中看到创建的仓库名了 2 本地克隆仓库 到github的项目仓库中找到项目的地址 xff0c 如第一图 磁盘中创建项目文件夹作为仓库 xff0c 右键选择torToiseGit gt
  • Fragment和Activity两种沉浸式状态栏的实现

    我们普通的Activity所有的标题栏颜色风格基本是一致的 xff0c 所以我们可以将这种单独的Activity的沉浸式状态栏放在BaseActivity中实现 但是如果遇到一级栏目的fragment中 xff0c 且有些fragment中
  • Android Studio Git实现回退至某一个版本

    流程 xff1a 一 android studio上部VCS gt Git gt Reset Head 二 选择Reset Type 注释 xff1a Reset Type git reset mixed xff1a 此为默认方式 xff0
  • Gitlab给指定人员设置指定权限

    1 选中指定的项目 xff0c 再选择Members 2 选择要指定的人员 xff0c 选择Project Access xff0c 为其添加指定的权限 xff0c 添加
  • 1.5 Qt Creater使用Python开发桌面软件的程序打包

    当我们开发完成软件后 xff0c 如果需要分发到其它电脑上运行 xff0c 我们需要进行程序打包 通过程序打包 xff0c 我们可以方便其他用户在其它设备上进行程序的使用 最简单且打包文件最小的方式为 xff1a 我们将开发用到的Pytho
  • Vue--Module parse failed: Unexpected character '' (1:0) (fonts/element-icons.ttf)

    当Vue引入iview Element ui后 xff0c npm run dev报错如下图 xff1a 本人项目采用webpack打包工具 xff0c 由于webpack打包工具是将浏览器不能直接运行的拓展语言 xff08 Scss xf