vue cli3项目打包部署到tomcat服务器运行

步骤：

一、找到文件vue.config.js，没有则自己创建一个

二、编写vue.config.js的内容

三、修改路由方式，修改为hash，文件位置自己找，vuecli3中在router.ts文件中

四、添加空路由

找到编译好的文件夹，如果作为独立项目，直接拷贝后放到Tomcat里即可，如果是放到另外一个项目中使用，则拷贝到其它项目中去

七、适配到EOS中使用

7.1、改变原EOS项目中的首页配置

在webapps\default\WEB-INF\web.xml中配置

7.2、修改原EOS项目中的登录成功的跳转页，也是项目主页

在webapps\default\coframe\auth\index.jsp中配置

第一次部署配置，关于部署vue项目dist包，在nginx配置遇到的坑：

1.vue项目中vue.config.js的配置：

devServer.proxy 可以是一个指向开发环境 API 服务器的字符串：

2.打包后dist包部署到linux服务器上，Nginx配置反向代理实现ajax进行跨域访问：

conf目录下nginx.conf配置如下：

配置之后重启nginx即可 ./nginx -s reload

注意：开始漏了rewrite ^/prod-api/(.*) 1 break请求后台接口一直404 not found,

用vue cli创建一个项目

Inside a Vue CLI project, @vue/cli-service installs a binary named vue-cli-service . You can access the binary directly as vue-cli-service in npm scripts, or as **./node_modules/.bin/vue-cli-service **from the terminal.

这里如果我们运行 npm run serve, 实际上运行的就是 vue-cli-service serve

这个源码我们可以在**./node_modules/.bin/vue-cli-service **打开查看

这里我们可以看到运行的过程：

我们可以了解到val的值是

可看到一个service的服务运行，而这个service实际上是：

这是一个类Service的实例对象，而这个类Service的位置在：

@vue >cli-service下文件夹lib下的Service.js文件：

对应的设置publicPath,outputDir.... 设置在

@vue >cli-service下文件夹lib下options.js文件中

服务器端口设置文件：

@vue >cli-service >lib >commands文件夹下的serve.js文件：

---