目录结构:
代码:
<img src="./title.png" />
在本地服务器运行可以正常加载, 但是放到服务器(tomcat)上就无法加载, 项目部署在webapp/myproject/目录,在服务器应该请求的图片路径是http://1.1.1.1:8080/myproject...但是实际请求的图片路径是http://1.1.1.1:8080/static/im...请问如何在vue里把图片路径写成当前目录而不是服务器根目录
这个问题我之前遇到过,已经整理成文档,你需要修改的是webpack配置,然后重新打包就可
刚好这个我也遇到过,放在服务器时此时的图片路径应该是绝对路径,在本地时就按<img src="./title.png" />路径,在服务器时就是<img src="/myproject/static/img/title.45ae5f4.png" />。当然上面的方法更加好
你如果用的脚手架,请熟悉下config里面几个JS的用途,尤其是index.js
build: { env: require('./prod.env'), index: path.resolve(__dirname, '../dist/index.html'), assetsRoot: path.resolve(__dirname, '../dist'), assetsSubDirectory: 'static', // 附件资源引用子目录 assetsPublicPath: '项目正式地址', // 服务器资源引用根目录 productionSourceMap: true, }
刚好这个我也遇到过,放在服务器时此时的图片路径应该是绝对路径,在本地时就按<img src="./title.png" />路径,在服务器时就是<img src="/myproject/static/img/title.45ae5f4.png" />。当然上面的方法更加好
你如果用的脚手架,请熟悉下config里面几个JS的用途,尤其是index.js