使用react webpack文件加载器提供静态pdf

Diz*_*ted 8 javascript pdf ecmascript-6 reactjs webpack

我正在提供一些静态文件,如图像和字体,没有任何问题.当我尝试对PDF文件执行相同操作时,我收到错误.

错误在./src/views/default/components/Footer.js中

c:\ Resurs\repos\Frontend\src\views\default\components\Footer.js 5:17 error导入模块中的解析错误/ src/includes/ANVANDARAVTAL_MITTKONTOR.pdf'import/default

✖1个问题(1个错误,0个警告)

./src/views/default/components/Footer.js中的错误找不到模块:错误:无法在c:\ Resurs\repos\Frontend\src\views\default\components @ ./src中解析模块'application-loader' /views/default/components/Footer.js 21:32-84

webpack配置工作正常,包含jsx,es6,css,静态文件的所有加载器......除了PDF的加载器配置.

{
    test: /\.pdf(\?v=[0-9]\.[0-9]\.[0-9])?$/,
    loader: 'file-loader?minetype=application/pdf&name=[name].pdf'
}
Run Code Online (Sandbox Code Playgroud)

我的另一个加载器配置,对于PDF来说看起来几乎相同,并且工作......为什么(SOBBING)!? 例如:

{
    test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
    loader: 'file-loader'
}
Run Code Online (Sandbox Code Playgroud)

将文件导入react组件如下所示:

import bg from "src/design/images/loginBG.jpg"; //works fine
import pdf from "src/includes/ANVANDARAVTAL_MITTKONTOR.pdf"; //NOT WORKING!
Run Code Online (Sandbox Code Playgroud)

我已经尝试了这么多配置,谷歌搜索错误,谷歌搜索可以解决问题的加载器.没有什么关于从webpack/react提供静态内容,除了通常的图像,css,js.

我也试过提供一个txt文件,看它是否有效.这也会失败并出现与PDF相同的错误.

为什么webpack在使用文件加载器时会尝试解析文件?

Jak*_*ser 18

__CODE__在构建期间使用webpack 处理静态内容,并且我能够成功地将PDF传输到我的构建文件夹.这是我正在做的简化版本:

反应组件 __CODE__

Webpack加载器

import PdfFile from '../../src/file.pdf'
Run Code Online (Sandbox Code Playgroud)