# 环境部署

# 准备工作

JDK >= 1.8 (推荐1.8版本)
Mysql >= 5.7.0 (推荐5.7版本)
Redis >= 3.0
Maven >= 3.0
Node >= 10

TIP

前端安装完node后，最好设置下淘宝的镜像源，不建议使用cnpm（可能会出现奇怪的问题）

# 运行系统

# 后端运行

1、导入到Eclipse，菜单File->Import，然后选择Maven->Existing Maven Projects，点击Next> 按钮，选择工作目录，然后点击Finish按钮，即可成功导入。 Eclipse会自动加载Maven依赖包，初次加载会比较慢（根据自身网络情况而定） 2、创建数据库rtap，导入相应的数据库脚本 3、打开项目运行com.rtap.RtapApplication.java，出现如下图表示启动成功。

(♥◠‿◠)ﾉﾞ rtap 项目启动成功   ლ(´ڡ`ლ)ﾞ
  _____     _____       ___   _____
 |  _  \   |_   _|     /   | |  _  \
 | |_| |     | |      / /| | | |_| |
 |  _  /     | |     / /_| | |  ___/
 | |  \ \    | |    / /  | | | |
 |_|   \_\   |_|   /_/   |_| |_|

TIP

后端运行成功可以通过(http://localhost:8080/)访问，但是不会出现静态页面，可以继续参考下面步骤部署前端，然后通过前端地址来访问。

# 前端运行

# 安装依赖
npm install

# 强烈建议不要用直接使用 cnpm 安装，会有各种诡异的 bug，可以通过重新指定 registry 来解决 npm 安装速度慢的问题。
npm install --registry=https://registry.npm.taobao.org

# 本地开发 启动项目
npm run dev

TIP

因为本项目是前后端完全分离的，所以需要前后端都单独启动好，才能进行访问。前端安装完node后，最好设置下淘宝的镜像源，不建议使用cnpm（可能会出现奇怪的问题）

# 必要配置

修改数据库连接，编辑resources目录下的application-druid.yml

# 数据源配置
spring:
    datasource:
        type: com.alibaba.druid.pool.DruidDataSource
        driverClassName: com.mysql.cj.jdbc.Driver
        druid:
            # 主库数据源
            master:
                url: 数据库地址
                username: 数据库账号
                password: 数据库密码

修改服务器配置，编辑resources目录下的application.yml

# 开发环境配置
server:
  # 服务器的HTTP端口，默认为80
  port: 端口
  servlet:
    # 应用的访问路径
    context-path: /应用路径

# 部署系统

TIP

因为本项目是前后端完全分离的，所以需要前后端都单独部署好，才能进行访问。

# 后端部署

打包工程文件在rtap项目的bin目录下执行package.bat打包Web工程，生成war/jar包文件。然后会在项目下生成target文件夹包含war或jar

TIP

多模块版本会生成在rtap/rtap-admin模块下target文件夹

部署工程文件

1、jar部署方式

使用命令行执行：java –jar rtap.jar或者执行脚本：rtap/bin/run.bat

2、war部署方式

rtap/pom.xml中的packaging修改为war，放入tomcat服务器webapps

<packaging>war</packaging>

TIP

多模块版本在rtap/rtap-admin模块下修改pom.xml

SpringBoot去除内嵌Tomcat（PS：此步骤不重要，因为不排除也能在容器中部署war）

<!-- 多模块排除内置tomcat -->
<dependency>
	<groupId>org.springframework.boot</groupId>
	<artifactId>spring-boot-starter-web</artifactId>
	<exclusions>
		<exclusion>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-tomcat</artifactId>
		</exclusion>
	</exclusions>
</dependency>

<!-- 单应用排除内置tomcat -->
<exclusions>
	<exclusion>
		<artifactId>spring-boot-starter-tomcat</artifactId>
		<groupId>org.springframework.boot</groupId>
	</exclusion>
</exclusions>

# 前端部署

当项目开发完毕，只需要运行一行命令就可以打包你的应用

# 打包正式环境
npm run build:prod

# 打包预发布环境
npm run build:stage

构建打包成功之后，会在根目录生成dist文件夹，里面就是构建打包好的文件，通常是***.js、***.css、index.html等静态文件。

通常情况下dist文件夹的静态文件发布到你的 nginx 或者静态服务器即可，其中的index.html是后台服务的入口页面。

outputDir 提示

如果需要自定义构建，比如指定 dist 目录等，则需要通过 config 的 outputDir 进行配置。

publicPath 提示

部署时改变页面js 和 css 静态引入路径 ,只需修改vue.config.js文件资源路径即可。

publicPath: './' //请根据自己路径来配置更改

export default new Router({
  mode: 'hash', // hash模式
})

# 环境变量

所有测试环境或者正式环境变量的配置都在.env.development等.env.xxxx文件中。

它们都会通过webpack.DefinePlugin插件注入到全局。

注意！！！

环境变量必须以VUE_APP_为开头。如:VUE_APP_API、VUE_APP_TITLE

你在代码中可以通过如下方式获取:

console.log(process.env.VUE_APP_xxxx)

# Tomcat配置

修改server.xml，Host节点下添加

<Context docBase="" path="/" reloadable="true" source=""/>

dist目录的文件夹下新建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_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>

← 快速了解项目介绍 →