JAVA全系列 教程
3762个小节阅读:7090.9k
目录
C语言快速入门
JAVA全系列 教程
面向对象的程序设计语言
Python全系列 教程
Python3.x版本,未来主流的版本
人工智能 教程
顺势而为,AI创新未来
大厂算法 教程
算法,程序员自我提升必经之路
C++ 教程
一门通用计算机编程语言
微服务 教程
目前业界流行的框架组合
web前端全系列 教程
通向WEB技术世界的钥匙
大数据全系列 教程
站在云端操控万千数据
AIGC全能工具班
A A
White Night
在前后端分离项目中,作为后端开发者,一般接口测试成功后即可认为开发完成。之后将开发好的接口告知前端开发者,前端开发者即可访问接口,获取数据,完成展示。此处我们使用已经开发好的前端工程,展示项目功能。
解压前端项目。
修改前端项目,将配置文件vue.config.js
中后端项目的路径改为管理员API模块的路径
xxxxxxxxxx
const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
transpileDependencies: true,
// 保存文件的时候不进行eslink检查
lintOnSave: false,
// 开发环境
devServer: {
// 代理服务器,也就是后端项目的路径
proxy: {
'/': {
target: 'http://localhost:8001',
changeOrigin: true,
// pathRewrite: {
// '^/api': ''
// }
},
}
}
})
修改前端项目,/src/utils/axios.js
,注释掉项目的登录认证
xxxxxxxxxx
import axios from 'axios'
import { ElMessage } from 'element-plus'
import router from '@/router'
// 响应拦截器
axios.interceptors.response.use(res => {
const { data = {}, status } = res
if (status == 200) {
if (data.code != 200) {
ElMessage.error(data.message)
// if (data.code == 401) {
// router.push('/login')
// return
// }
return Promise.reject(data)
}
return data.data
} else {
const { status, statusText } = res
ElMessage.error(status + statusText)
return Promise.reject(res)
}
})
export default axios
安装nodeJS
在前端项目解压路径安装yarn
xxxxxxxxxx
npm install -g yarn
使用yarn下载前端项目依赖
xxxxxxxxxx
yarn install
使用yarn运行前端项目
xxxxxxxxxx
yarn serve