如何使用 Vue Cli 3 添加对 PDF 文件的支持?

2023-11-29

我需要配置 Webpack 来接受和处理 PDF 文件url-loader通过 Vue Cli(最新)。

vue.config.js

module.exports = {
  configureWebpack: {
    rules: [
      {
        test: /\.(pdf)(\?.*)?$/,
        use: [
          {
            loader: 'url-loader',
            options: {
              name: 'files/[name].[hash:8].[ext]'
            }
          }
        ]
      }
    ]
  }
}

上面的内容看起来正确还是我遗漏了什么?有关于此的文档在这里:https://github.com/vuejs/vue-cli/blob/dev/docs/webpack.md#basic-configuration

我收到错误:

WebpackOptionsValidationError:配置对象无效。网页包 已使用不匹配的配置对象进行初始化 API 架构。配置具有未知属性“规则”。

我显然缺少一些关于如何在 Vue.js 中增强生成的 Webpack 配置的理解。

帮助表示感谢!谢谢


事实证明,我错过了另一个级别rules array.

module: {}

所以应该是完整的:

module.exports = {
  configureWebpack: {
    module: {
      rules: [
        {
          test: /\.(pdf)(\?.*)?$/,
          use: [
            {
              loader: 'url-loader',
              options: {
                name: 'files/[name].[hash:8].[ext]'
              }
            }
          ]
        }
      ]
    }
  }
}

我的错!希望这对那里的人有帮助。

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

如何使用 Vue Cli 3 添加对 PDF 文件的支持? 的相关文章

随机推荐

  • 自动完成的简单 Solr 模式问题

    我有一个非常简单的 SQL 表 我想将其导入到 Solr 中 但由于我想要搜索的功能 我无法确定最佳模式 用户将开始在输入框中键入内容 在 3 个字符后 它将向服务器发送请求并提取最相关的结果 返回前 15 个匹配的 ID 和名称 表例 i
  • 使用 jQuery DatePicker 动态更改 minDate 和 maxDate

    我在使用 jQuery Datepicker 时遇到了一个特殊问题 我可以轻松添加日期范围 但我希望可选范围根据用户选择的事件进行更改 因此 如果他们选择事件 1 则只能从事件 1 的日期范围中选择日期 我编写了一个简单的小函数 每当用户选
  • 如何允许引导选项卡的选项卡在 ckeditor 编辑器中工作?

    这是我正在努力应对的挑战 我有一个用户希望能够使用单个 ckeditor 实例中的引导选项卡来浏览不同的选项卡 我了解大多数 a 标签禁用链接的原因 但希望仅允许这些选项卡链接发生该事件 我附上了一张屏幕截图 显示编辑器的内容中有一个引导选
  • 在 Google BigQuery 中使用 regexp_extract 提取数据

    我正在尝试从具有多个字符的列中提取数据 并且我只对从输入字符串中获取特定字符串感兴趣 我的示例输入和输出如下 我如何使用 regexp extract 函数来实现这一点 如果您从事过 GBQ 工作 有人可以分享他们对此的想法吗 谢谢 SQL
  • 在 SQL Server 中,“SET ANSI_NULLS ON”是什么意思?

    定义说 当 SET ANSI NULLS 为 ON 时 使用 WHERE column name NULL 的 SELECT 语句将返回零行 即使 column name 中存在空值也是如此 即使 column name 中存在非空值 使用
  • Google AppEngine中的JSP是否支持JDK1.8

    我有一个应用程序引擎Eclipse 中的项目 我保留了一个JSP file在 WAR 文件夹中 我已将安装的 jre 中的路径指定为JDK1 8 现在当我运行该项目时local单击超链接后 JSP 文件成功加载 部署到 Google App
  • 计算文件行数的最快方法

    我有一个巨大的 CSV 文件 我想知道它的总行数其中 目前我正在使用类似的东西 它工作完美 但速度很慢 FIND c FILENAME csv 但我不知道这是否是迭代 CSV 中所有行的最快方法 有什么建议或者方法可以教教我吗 我的 CSV
  • 在 Xamarin Forms 中定义 xmlns

    我创建了一个 Xamarin Forms 应用程序 我创建了另一个 PCL 库来保存颜色代码等 UI 常量 可移植项目名称为App PCL 库项目是实用程序 在我的 PCL 库中定义了这个 namespace App Utilities p
  • 如何在opencv中分割手写和打印数字而不丢失信息?

    我编写了一种算法 可以检测打印和手写数字并将其分段 但是在使用滑雪图像包中的clear border删除外部矩形手写数字时会丢失 任何阻止信息的建议 Sample 如何分别获得全部5个角色 从图像中分割字符 方法 对图像进行阈值处理 将其转
  • C# 串口和超级终端

    我正在使用 C 和 Serialport 和 com0com 虚拟串口 我的问题是我的 C 应用程序无法从超级终端接收数据 事件 DataRecived 未触发 如果我手动调用 readExisting 我什么也得不到 要测试此问题 您可以
  • C++进程的读内存

    我正在尝试读取地址的值 但我似乎无法真正做到这一点 我正在尝试获取 client dll 0xA9C0DC 0x00FC 我只是想从游戏中了解玩家的健康状况 这是我的代码 include
  • jboss 6.3.0:删除resteasy并使用jersey的好方法

    我正在使用球衣 这是我的 jboss 部署结构
  • 在 Firebase 安全规则中,如何阻止黑客运行脚本来注册您的网站?请记住我需要他们能够注册

    在 Firebase 安全规则中 如何阻止黑客运行脚本来注册您的网站 请记住 我需要他们能够在我的主页上进行外部注册 所以我不能说他们需要登录 我通过阅读 Firebase 安全文档了解了基本设置 但我担心它不够安全 特别是如果有人新创建了
  • 从存储在 sdcard 上的 png 文件创建位图 (Android)

    我尝试从 SD 卡上存储的 Png 文件创建位图 然后在 imageView 中设置该位图 但它不起作用 这是代码 import java io File import java io FileOutputStream import jav
  • 快速从字符串中获取整数值

    所以我可以这样做 var stringNumb NSString 1357 var someNumb CInt stringNumb intValue 但我找不到方法来做到这一点String 我想做这样的事情 var stringNumb
  • 如何使按钮在单击后立即不可见?

    我想知道如何使按钮可见 但单击时我希望它不可见 因此根本不会显示 button setOnClickListener new OnClickListener Override public void onClick View v Butto
  • rpy2 importr 因 xts 和 quantmod 失败

    我是 rpy2 新手 在使用 importr 导入 R 包 xts 和 quantmod 时遇到问题 Code is from rpy2 robjects packages import importr xts importr xts qu
  • Chartboost 与 XCode 6.1 的集成问题

    我在同一项目的 Xcode 6 0 中集成了 Chartboost 它工作正常 但当我将 Xcode 更新到 Xcode 6 1 时 桥接头文件无法成功编译 我已经在我的项目中添加了 Chartboost 框架 并添加了指南中提到的这些必需
  • Android 软键按钮隐藏视图的内容

    我在 Android 上带有软键按钮的设备上遇到布局太大的问题 总而言之 我的问题是为什么布局被配置为 匹配父项 其视图边界是否扩展到 真实 底部窗口 边界 而不是软键按钮上方 现在我的具体问题 使用 View 显示relativelayo
  • 如何使用 Vue Cli 3 添加对 PDF 文件的支持?

    我需要配置 Webpack 来接受和处理 PDF 文件url loader通过 Vue Cli 最新 vue config js module exports configureWebpack rules test pdf use load