第一步 ,打包程序
命令行状态进行项目目录 输入
npm run build
如果打包成功,项目dist下会存在以下的文件和目录
2、接下来的部署主流的有两种解决方案
1)用nginx把静态站点带起来(企业用的多,学完之后再用)
2)放到tomcat里运行(我们采用他)
webapps/ROOT下,将来时不url不需要上下文http://localhost:8080/自已的controller地址
如果把程序放到了类似webapps/his这种目录下,将来访问时需要带上下文http://localhost:8080/his/自已的controller地址
3)注意修改前端端口8081
D:\apache-tomcat-8.0.36\conf\server.xml
搜索Connector port="8080",把端口改为前端实际要部署到的端口比如8081
4)启动
D:\apache-tomcat-8.0.36\bin 双击startup.bat 运行(我们当前用的windows环境)
若下linux下,进入:\apache-tomcat-8.0.36\bin ./startup.sh
5)测试
http://localhost:8081/
成功
扩展vue部署到非 ROOT下
1.config/index.js 修改上下文路径
assetsPublicPath: '/his',
2、router下的index.js
export default new Router({
// base: getAbsolutePath(),
base: "/his/",
routes: [
3、打包后的index.html里引用js css的部分把前面的斜线去掉
<!DOCTYPE html><html><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><title>vue-his</title><link href=static/css/app.4f7340ee6d0b5e93b1ed2ae8e1d9bb31.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=static/js/manifest.2ae2e69a05c33dfc65f8.js></script><script type=text/javascript src=static/js/vendor.ea33a69b836ff3fc6a29.js></script><script type=text/javascript src=static/js/app.c082230e704982638ad4.js></script></body></html>
4 测试: