tomcat部署vue项目教程文档
安装nodejshttps://blog.csdn.net/zzwwjjdj1/article/details/51980082全局安装@vue/cli安装好nodejs后,打开命令行运行命令:npm install -g @vue/cli目前vuecli版本为3.3,安装完cli后,命令行运行 vue --version可以看到。根目录运行npm run buildn...
安装nodejs
https://blog.csdn.net/zzwwjjdj1/article/details/51980082
全局安装@vue/cli
安装好nodejs后,打开命令行运行命令:npm install -g @vue/cli
目前vuecli版本为3.3,安装完cli后,命令行运行 vue --version可以看到。
根目录运行npm run build
nodejs和vuecli都安装成功后,在项目根目录运行 npm run build 命令
安装java
网上自己找。
下载tomcat
压缩包下载:http://mirror.bit.edu.cn/apache/tomcat/tomcat-9/v9.0.20/bin/apache-tomcat-9.0.20.zip
解压tomcat压缩包。
把打包后的文件夹放到webapps文件夹下
vue项目打包完成后,把打包的文件夹放到tomcat的webapps文件夹下,完成!!!
静态文件修改后,一般是不需要重启tomcat的。
启动和关闭tomcat
在解压的tomcat文件夹下的bin目录里有2个.bat文件,双击startup.bat 启动tomcat;双击shutdown.bat关闭tomcat服务
解决history模式路由404问题
vue打包的项目放在tomcat里,路由会出现404问题,只要把所有404重定向到index.html文件就能解决。
在打包后的项目根目录创建WEB-INF文件夹,在WEB-INF文件夹下创建web.xml,内容如下:
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee
http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
version="4.0"
metadata-complete="true">
<display-name>xxxxxx</display-name>
<error-page>
<error-code>404</error-code>
<location>/index.html</location>
</error-page>
</web-app>
更多推荐
所有评论(0)