vue 引入本地pdf文件

2022-11-07  本文已影响0人  多记录多学习

Cannot GET /static/test.pdf
本地引入pdf文件

   <iframe src="../../../../../static/test.pdf" frameborder="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

需要配置file-loader对相应的文件进行编译

 yarn add file-loader -D
  {
          test: /\.pdf$/,
          loader: 'file-loader'
   }

再次启动项目成功。

成功引入后页面提示Cannot GET /static/test.pdf,控制台提示404无法找到对应的文件
由于一开始文件是放在assets文件夹下的,但是无果,我尝试放在static文件夹下还是失败,
最后看到说是需要将static下的文件打包后拷贝到static下,不然打包后的文件会不存在

const CopyPlugin = require('copy-webpack-plugin');
new CopyPlugin({
        patterns: [{ 
          from: path.resolve(__dirname, './static'),
          to: path.resolve(__dirname, './dist/static'),
        }]
})

再次启动项目就成功了。

上一篇下一篇

猜你喜欢

热点阅读