vue.js - 部署 Vue.js 应用程序后下载 PDF 的问题
问题描述
所以我正在创建一个 Vue.js 网络应用程序作为我的简历。在那里,我希望用户能够真正下载我的简历副本,但我似乎无法让它正常工作。在我的Home.vue
页面上,我有:
<template>
<div class="flex-grow overflow-auto max-h-screen w-full dark:text-gray-300">
<div class="m-auto pt-4 lg:grid lg:grid-cols-2 lg:grid-rows-2 lg:gap-8">
<div class="m-auto">
<img class="rounded-md" alt="headshot" src="../assets/headshot.jpg">
</div>
<div class="m-auto">
<h2 class="text-2xl pl-2 py-4 text-center lg:text-left lg:text-8xl lg:px-8">Quick blurb</h2>
</div>
<div class="lg:col-span-2 mx-auto lg:h-8">
<p class="text-base text-center lg:text-2xl">
<a href="mailto:example@example.com">Email</a>
|
<a href="https://www.linkedin.com" target="_blank">LinkedIn</a>
|
<a href="https://github.com" target="_blank">GitHub</a>
|
<a href="my_resume.pdf" download>Resume</a>
</p>
</div>
</div>
</div>
</template>
<script>
export default {
name: 'Home'
}
</script>
当我在本地运行它时,下载它没有问题。当我从 运行yarn build
和运行服务器时dist/
,下载它没有问题。只有当我将它部署在 AWS Amplify 上并从那里进行测试时,我才会遇到问题(基本上就像它找不到它一样)。我试过把
<a href="/my_resume.pdf" download>Resume</a>
也
<a :href="`${publicPath}my_resume.pdf`" download>Resume</a>
....
data () {
return {
publicPath: process.env.BASE_URL
}
}
无济于事。它在public/
文件夹中,还有index.html
一个可以毫无问题地访问的图标。我不知道问题是什么。
解决方案
推荐阅读
- node.js - 如何在 TypeScript 界面中定义 mongoose _id?
- node.js - Cucumber js如何提供共享步骤定义
- python - LSTM 高损失,不随每个时期减少
- c++ - 构造函数不抛出异常
- javascript - 禁用 form.submit 上的按钮会导致它在发布的数据中被跳过
- python - Python:使用另一个邮箱发送电子邮件
- javascript - Vue Filepond 图像裁剪
- javascript - JavaScript 在 HTML 电子邮件模板中不起作用
- rest - 正确的 REST 调用以创建资源
- android - 获取存储在 React Native 中的文档目录中的文件名数组