Vue可以将static目录指向静态文件,在Vue中指向static文件夹的方式十分简单,只需要在项目根目录下新建一个static文件夹,然后在Vue的配置文件中,添加如下配置:
module.exports = { baseUrl: '/', outputDir: 'dist', assetsDir: 'static', productionSourceMap: false, devServer: { port: 8080, proxy: null } }
在这个配置文件中,assetsDir表示静态文件存放的目录,默认情况下是放在根目录下的assets文件夹,通过配置将其改为static,这样我们就可以将相关的静态文件放在该文件夹下了。例如,我们将图片放在static文件夹下,在组件中通过相对路径引用即可:
在构建项目时,Vue会将整个static文件夹拷贝到输出目录(即dist文件夹)下,这样我们可以放心地引用这些静态资源。