vue项目中下载静态资源里的pdf文件

1.把文件放在项目目录src/assets文件下

2.在项目是用a标签下载

html 复制代码
        <a
          :href="require('@/assets/download.pdf')"
          download="使用说明.pdf"
          target="_blank"
        >
          <img src="@/assets/banner.png" class="bannerimg"
        /></a>

以上项目运行会报错

Failed to compile.

./src/assets/download.pdf 1:0 Module parse failed: Unexpected token (1:0) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders (Source code omitted for this binary file)

3.需要在vue.config.js中配置!!!

具体配置代码:

javascript 复制代码
 configureWebpack: {
    name: name,
    resolve: {
      alias: {
        '@': resolve('src')
      }
    },
    module: {
      rules: [{
        test: /\.pdf$/,
        use: [{
          loader: 'url-loader',
          options: {
            name: 'files/[name].[ext]'
          }
        }]
      }]
    }
  },
相关推荐
2501_920955575 小时前
PDF文件损坏打不开怎么修复?2025年最新修复工具测评与对比
pdf
季春二九5 小时前
PDF-XChange Editor丨加拿大PDF编辑转换工具
pdf
开开心心就好10 小时前
微软官方出品:免费数据恢复工具推荐
网络·笔记·microsoft·pdf·word·音视频·symfony
Dontla10 小时前
如何在PDF文档中打钩?(福昕阅读器)打√
pdf·福昕阅读器
拓端研究室10 小时前
2025全球生成式人工智能AIGC产业全景与行业应用研究报告|附900+份报告PDF、数据、可视化模板汇总下载
pdf·aigc
拓端研究室10 小时前
专题:2025中国制造业出海与出海品牌社媒影响力洞察报告|附300+份报告PDF、数据、绘图模板汇总下载
pdf
烽火连城诀11 小时前
PDF 全文翻译开发实现思路:挑战、细节与工程化解决方案
pdf·pdf全文翻译·pdf保持格式翻译·全文翻译·pdf版式保持
袁煦丞 cpolar内网穿透实验室11 小时前
Stirling-PDF合并拆分加密样样行:cpolar内网穿透实验室第563个成功挑战
pdf·远程工作·内网穿透·cpolar·pdf工具
小嘟嚷ovo11 小时前
h5单页预览PDF文件模糊问题解决
pdf
星光一影14 小时前
PDF工具箱/合并拆分pdf/提取图片
pdf·c#