I am trying to simply download a .pdf
file out of a Vue component.
It works with for example .jpg
or .png
files, but not with .pdf files.
This is my vue.config.js
module.exports = {
chainWebpack: config => {
config.module
.rule("vue")
.use("vue-loader")
.loader("vue-loader")
.tap(options => {
// modify the options...
return options;
});
config.module
.rule("pdf")
.test(/\.pdf$/)
.use("file-loader")
.loader("file-loader");
}
}
In my simplified Vue component, I try to download the file like this(works with .jpg)
<template>
<div>
<a :href="pdfLink" download="myPdf.pdf">Download</a>
</div>
</template>
<script>
name: "PdfFileComponent",
data: () => ({
pdfLink: require("../assets/myPdf.pdf")
})
</script>
Any help is appreciated!
I got it working with some changes to my rules in the vue.config.js
module.exports = {
configureWebpack: {
rules: [
{
test: /\.(pdf)(\?.*)?$/,
use: [
{
loader: 'url-loader',
options: {
name: 'files/[name].[hash:8].[ext]'
}
}
]
}
]
}
}
Hope this helps someone with the same problem.