首页 > 其他 > 详细

【转】】Vue项目部署tomcat,刷新报错404解决办法

时间:2019-02-20 11:50:21      阅读:203      评论:0      收藏:0      [点我收藏+]

转自【https://blog.csdn.net/g631521612/article/details/82835518】

vue创建项目使用脚手架有两种方式:

1,vue init webpack my

这种方式的项目打包,需要找到config/index.js文件将build中的assetsPublicPath: ‘/‘,修改成 assetsPublicPath: ‘./‘,

build: {
// Template for index.html
index: path.resolve(__dirname, ‘../dist/index.html‘),

// Paths
assetsRoot: path.resolve(__dirname, ‘../dist‘),
assetsSubDirectory: ‘static‘,
assetsPublicPath: ‘./‘,
,然后执行npm run build,会在根目录下生成dist文件夹

 

将dist下的文件扔到你的tomcat的webapps文件夹的项目下即可。

2、vue init webpack-simple my

这种情况下的项目没有config,这时候就不需要配置1中的index.js文件了,直接执行npm run build ,同样会生成dist文件夹,但是这种情况下dist下面没有index.js ,所以需要你手动将dist下的文件个index.js文件,一同复制到tomcat的webapps项目下,也会有1中的效果。

如果没有意外,这时候项目应该可以访问了,但是当你选择单页面路由的时候,再刷新页面会出现404,这种情况肯定是要修复的,这时候就需要在tocmat的webapps下的项目中创建WEB-INF文件夹,在文件夹中创建文件web.xml。格式如下:

 

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_3_1.xsd"
version="3.1" metadata-complete="true">
<display-name>Router for Tomcat</display-name>
  <error-page>
  <error-code>404</error-code>
  <location>/index.html</location>
  </error-page>
</web-app>

重启,刷新,完美修复。

【转】】Vue项目部署tomcat,刷新报错404解决办法

原文:https://www.cnblogs.com/vae860514/p/10405573.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!