通过Vue CLI和Webpack发布静态PDF文件的服务器问题

Question

3

我使用VueCLI（+ Vuetify）搭建了一个小型前端。

我想渲染一个按钮，onClick打开位于项目文件夹树中的pdf的新选项卡。

我遇到了一个错误，花费了数小时寻找原因，似乎需要修改webpack配置。

但是出现了include: paths -> paths is not defined的错误。

我必须承认我不知道webpack在幕后是如何工作的，所以需要任何帮助。

- Ragnar

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Ian Walter · Accepted Answer

也许您不需要使用Webpack：您可以将其放在静态文件夹中并链接到它：<a href="/static/mypdf.pdf">pdf</a>。如果您想要使用Webpack，请将其放在src/assets目录中并导入它，然后将其添加到数据对象中：

import pdf from '../assets/mypdf.pdf'

//...
data: () => ({ pdf })
//...

然后在您的组件中使用链接：

<a :href="pdf">pdf</a>

你可能已经将include: paths添加到加载器配置中，但你没有定义它。与其修改图像加载器，不如为PDF添加一个新的加载器：

答案:

你可能已经将include: paths添加到加载器配置中，但你没有定义它。与其修改图像加载器，不如为PDF添加一个新的加载器：

  {
    test: /\.(pdf)(\?.*)?$/,
    loader: 'url-loader',
    options: {
      name: utils.assetsPath('[name].[hash:7].[ext]')
    }
  }

如果您想要更改[name].[hash:7].[ext]，比如说您想要在资产中添加一个pdfs目录，而不是使用基础资产目录，则应该使用pdfs/[name].[hash:7].[ext]