使用Vue CLI的Vue 2-如何使src/static静态，以便我可以使用其中的图像？

Question

我正在尝试打包我的Vue CLI应用程序来打包src/static/xyz.png，这样我就可以将它引用为/static/xyz.png。

Vue文档并没有真正展示如何做到这一点。我需要一个vue.config.js，但在这里：

https://cli.vuejs.org/guide/webpack.html

还有这里：

https://cli.vuejs.org/guide/html-and-static-assets.html#html

我不知道我需要做什么。有什么想法吗？我试过很多关于webpack的东西，但显然对webpack还不够了解……

Answer 1

在Vue CLI项目中，文件位于public/ are automatically bundled as static assets下，因此您不需要为此进行自定义配置。您的镜像应存储在：

<projectRoot>/public/static/xyz.png

然后在标记中引用它们，如下所示：

<img src="/static/xyz.png">

请注意，这些静态资源不是通过Webpack运行的，因此它们不会被优化(即，图像文件大小可能不必要地大)。