0

我正在一个投资组合网站上工作，我需要在resume.pdf单击按钮时从本地文件中打开一个文件，但我无法使其工作。我正在使用gridsome和 vue.js。我最初尝试了这段代码：

<a class="cv-button float-right"
              href="../assets/resume.pdf"
              target="_blank">MY CV</a>

但是当我点击链接（按钮）时，我收到了这个错误：

Cannot GET /src/assets/resume.pdf

它转到的网址是：

http://localhost:8080/src/assets/resume.pdf

之前有人问过我面临的问题： 使用VueJS 在另一个窗口中打开 PDF 文件 并使用 VueJS 打开 PDF。
我尝试使用提供的解决方案，但它们都没有真正起作用，而且我每次都遇到几乎相同的错误！我加载图像没有问题，但这个 pdf 文件不起作用。该文件位于src -> assets -> resume.pdf. 请注意，我尝试了许多打开文件的方法，但都失败了，包括使用 vue.jsmethods和windos.open()javascript 或required关键字或使用不同的方式来提供源文件的路径，例如 add@/assets/resume.pdf等。
下面是我的 package.json 文件：

{
  "name": "portfolio.farzinnasiri.com",
  "version": "0.0.2",
  "private": true,
  "scripts": {
    "build": "gridsome build",
    "develop": "gridsome develop",
    "explore": "gridsome explore"
  },
  "dependencies": {
    "@fortawesome/fontawesome-svg-core": "^1.2.28",
    "@fortawesome/free-brands-svg-icons": "^5.13.0",
    "@fortawesome/free-solid-svg-icons": "^5.13.0",
    "@fortawesome/vue-fontawesome": "^0.1.9",
    "@gridsome/source-filesystem": "^0.6.2",
    "@gridsome/transformer-remark": "^0.5.0",
    "gridsome": "^0.7.0",
    "vue-typer": "^1.2.0"
  },
  "devDependencies": {
    "node-sass": "^4.14.1",
    "sass-loader": "^8.0.2"
  }
}

网站的预览在这里： http: //farzinnasiri.ir。当然我还没有添加pdf文件，但理论上当有人点击MY CV按钮时，他/她应该被引导到浏览器中的简历文件......


最后一件事是我在最终构建的项目（文件夹）中找不到 pdf 文件，dist所以也许 vue.js 一开始就无法读取文件！
请在这里给我一些帮助。感谢您的关注

4

1 回答 1

2

好的，所以我gridsome通过简单地将我的 pdf 文件放在创建项目时创建的static目录中来解决问题。gridsomeGridsome 将该文件夹中的所有内容直接放入该文件dist/夹中，因此我只需要为其提供如下路径：

<g-link class="cv-button float-right" href="/resume.pdf" target="_blank">MY CV</g-link>
于 2020-05-25T07:45:52.997 回答