Vue前端项目部署在tomcat
修改路由配置src/router/index.js,增加配置base‘/Vue/’,如果这里不配置,会导致部署的项目首页访问一片空白,但不报错,且引入的文件有正常加载。执行npmrunbuild,将打包生成的dist目录下的所有东西粘贴到Tomcat/webapps/路径下新建一个Vue文件夹,Vue是自定义的项目名,访问路径格式>>ipport/Vue,例如http//localhost8080
·
第一步
配置java环境,下载tomcat后解压,然后将webapps里的默认文件删掉
第二步
修改vue项目下config/index.js,注意dev和build都要改assetsPublicPath的配置
module.exports = {
dev: {
...
assetsPublicPath: './',
...
},
build: {
...
assetsPublicPath: './',
...
}
}
修改路由配置src/router/index.js,增加配置base: ‘/Vue/’,如果这里不配置,会导致部署的项目首页访问一片空白,但不报错,且引入的文件有正常加载
export default new Router({
//如打包文件存放在Tomcat/webapps/Vue下,
//那么base就这么写
base: '/Vue/',
mode: 'history',
routes: [
...
]
})
第四步
执行npm run build,将打包生成的dist目录下的所有东西粘贴到Tomcat/webapps/路径下新建一个Vue文件夹,Vue是自定义的项目名,
第五步
启动tomcat,在tomcat下的bin目录中双击startup.bat文件,或者打开命令行去访问startup.bat
访问路径格式>>ip:port/Vue,例如:http://localhost:8080/Vue/,即可访问到Vue项目
注意:
前端项目中使用到了代码
const port = process.env.port || process.env.npm_config_port || 9528 // dev port
但部署到tomcat的时候会默认tomcat的端口8080而不是9528,如果要使用9528就需要修改tomcat的配置文件
然后将Connector标签下的port="8080"改成9528即可
更多推荐
已为社区贡献3条内容
所有评论(0)