1. 创建spring boot 后端项目
暂不编写,百度有很多教程
2. 创建vue 前端项目
暂不编写,百度有很多教程
3. spring boot 打包并部署到服务器
3.1 将项目设置为jar包
- 打开项目的pom.xml文件
- 打包代码,进入项目的主目录,打开命令行,执行以下代码
mvn clean && mvn package
- 进入
target
目录,复制项目名-版本号.jar
到服务器指定目录下。执行以下代码启动(注:jar包的名称可以任意修改。)
命令行直接启动后端项目java -jar 项目名-版本号.jar
或使用静默启动$nohup java -jar 项目名-版本号.jar &
4. vue打包
说明: @
表示项目的基准路径
4.1 项目引入基础配置
打开@/main.js
,引入必要的配置,其中axios
,./router
为必要的配置,其它的可根据自身的需求引入
// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App from './App'
import router from './router'
import resource from 'vue-resource'
import Moment from 'moment'
import axios from 'axios'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
Vue.config.productionTip = false
// 绑定 moment 进行时间格式化 ✔
Vue.prototype.$moment = Moment // 赋值使用
Vue.prototype.$axios = axios // 跨域请求
//引入element-ui
Vue.use(ElementUI)
// 安装 路由(url)
Vue.use(router)
// 绑定 vue-resource(ajax)
Vue.use(resource)
/* eslint-disable no-new */