1、静态资源放到src/assets/目录下

静态资源，例如图片、静态的JSON文件、视频、CSS等等，放到src/assets目录下。

不然会很蛋疼，这个坑我踩过了。切记，切记！！

以下是CHATGPT-4 Turbo的回答：

在 Vue 应用程序中，src/assets 目录确实有特别的处理。当你使用 Vue CLI 创建一个项目时，Webpack 负责构建过程，并默认配置了处理这个目录中的资源。

 

当你在组件中引用 src/assets 目录下的静态资源时，例如图片或样式文件，Webpack 会使用相应的加载器(loader)来处理它们。例如，图片可以通过 file-loader 或 url-loader 来处理，这允许你使用模块依赖语法引入资源，例如：

<template><img :src="imageUrl" />
</template><script>
// 通过相对路径引入图片
import myImage from '@/assets/my-image.png';export default {data() {return {imageUrl: myImage};}
};
</script>

Webpack 会将 @/assets/my-image.png 的引用解析为相应模块的路径