vue 引入本地pdf文件

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'),
        }]
})

再次启动项目就成功了。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容