扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
这篇文章主要介绍“vuejs项目如何部署到tomcat”,在日常操作中,相信很多人在vuejs项目如何部署到tomcat问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”vuejs项目如何部署到tomcat”的疑惑有所帮助!接下来,请跟着小编一起来学习吧!
我们提供的服务有:成都网站设计、成都网站制作、微信公众号开发、网站优化、网站认证、竹溪ssl等。为1000多家企事业单位解决了网站和推广的问题。提供周到的售前咨询和贴心的售后服务,是有科学管理、有技术的竹溪网站制作公司
vuejs项目部署到tomcat的方法:1、下载tomcat并解压;2、修改vue下的“config/index.js”;3、增加“base:'/aoxinwechat/'”;4、执行npm run build;5、启动tomcat即可。
本文操作环境:Windows7系统、Vue2.9.6、Dell G3电脑。
vuejs项目怎么部署到tomcat?
部署vue项目到tomcat上:
1、前提条件:有配置java环境,下载tomcat后解压https://tomcat.apache.org/download-80.cgi,得到如下目录
2、修改vue项目下config/index.js,注意dev和build都要改assetsPublicPath的配置
module.exports = { dev: { ... assetsPublicPath: './', ... }, build: { ... assetsPublicPath: './', ... } }
3、修改路由配置src/router/index.js,增加配置base: '/aoxinwechat/',如果这里不配置,会导致部署的项目首页访问一片空白,但不报错,且引入的文件有正常加载
export default new Router({ //如打包文件存放在Tomcat/webapps/aoxinwechat下, //那么base就这么写 base: '/aoxinwechat/', mode: 'history', routes: [ ... ] })
4、执行npm run build,将打包生成的dist目录下的所有东西粘贴到Tomcat/webapps/aoxinwechat路径下,aoxinwechat是自定义的项目名
5、启动tomcat,在tomcat下的bin目录中双击startup.bat文件,或者打开命令行去访问startup.bat,
访问路径格式>>ip:port/aoxinwechat,例如:http://localhost:8080/aoxinwechat/,即可访问到Vue项目。
到此,关于“vuejs项目如何部署到tomcat”的学习就结束了,希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习,快去试试吧!若想继续学习更多相关知识,请继续关注创新互联网站,小编会继续努力为大家带来更多实用的文章!
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流