首页 > 编程语言 >【nodejs】大事件后台管理项目(四)——Vue-admin-template结合

【nodejs】大事件后台管理项目(四)——Vue-admin-template结合

时间:2022-08-19 04:00:10浏览次数:116  
标签:vue nodejs admin 项目 Vue git template

观前提醒

在黑马程序员公众号提供的材料中就包括了前端项目,但是因为这个项目是用layui写的,已经有点过时了,所以我弄个Vue前端项目的接口调整。

上一个则只是简单跟着视频完成(因为拿到手的项目,别人都基本帮我们弄好了)。

另一个是我会选择使用Vue-admin-template4.x版模板去快速构建该大事件后台管理项目,在构建的同时,熟悉该模板的结构与相关的知识。

Vue-admin-template

下载与调试

测试

在git Bash中选定到你需要的文件夹中运行如下的命令:

git clone https://gitee.com/panjiachen/vue-admin-template.git

下载完成后,打开VSCode进入到vue-admin-template目录下,在终端执行如下命令,进行依赖安装和启动。

npm i
npm run dev

不用理会那些漏洞危害的报告,待程序启动成功后,通过浏览器访问地址http://127.0.0.1:9528/,将会看到下面的登录页面。

它采用的是mock文件夹的伪数据,并没有与后台真交互。

整合

接下来我参考了以下三篇博客,总算是搞清楚怎么交互了。
vue-admin-template实现登录过程(对接Controller)
SpringBoot整合vue-admin-template实现登录
基于vue-admin-template+SpringBoot+JWT实现登录

TODO

标签:vue,nodejs,admin,项目,Vue,git,template
From: https://www.cnblogs.com/PaturNax/p/16545142.html

相关文章

  • Vue——尚硅谷
    P13看、听第一遍时,觉得能懂,但再看一遍并操作会有更多收获,事实如此,耐着点性子,求知不能太心急。 ......
  • vue2和vue3的区别
    1、vue2每个模块必须有一个根节点,vue3则不需要 ===================分隔======================  2、创建vue实例的方法不一样router.js中:main.js中:  ===......
  • 在vue中使用echarts
    1.引入echarts先通过npm安装echartsnpmrunecharts--save2.在main.js中import*asechartsfrom'echarts';Vue.prototype.$echarts=echarts3.在.vue文件中(包括......
  • 通过 Docker 部署 nodejs -- egg 项目
    常用的docker命令安装docker环境docker--help查看docker命令提示dockerps-a查看所有运行的容器dockerimages查看所有的配置Dockerfile文件查看容......
  • 自动根据文件目录生成vue路由
    前言每创建一个新的页面需要手动添加路由虽然不是很麻烦的动作,但是也是很繁琐的动作,如果能够再创建文件的时候自动生成路由还是能省一些动作避免一些错误,比如导入路径不对......
  • vue eventbus 注意点
    如果a页面想在一开始就给B页面传值,那么b页面应在created函数里面接受,同时要先解绑一下事件($off)   ......
  • vue学习之------Windows PowerShell不识别vue命令
    已经全局安装了vue-cli,但是WindowsPowerShell不识别vue命令: 解决办法:1、以管理员身份运行PowerShell2、执行set-ExecutionPolicyRemoteSigned3、输入Y,回车,即可......
  • fastadmin 自定义tab栏传参到后台做筛选判断
    需求入下图:需要在原有的通过status字段搜索的tab栏中,新增一个无分组的tab栏,筛选没有属于任何分组的记录   新增无分组tab栏,需要在对应的model中的getStatusList方......
  • vue的相关
    报错:Vuepackagesversionmismatch:[email protected](D:\nodejs\node_global\node_modules\vue\dist\vue.runtime.common.js)[email protected](D:\nodejs\n......
  • springbot+vue项目的打包部署
    springbot+vue项目的打包部署使用vue进行前后端分离式开发,但最终部署还是要将前端放到后端中统一部署。一、打包1.前端打包(1)流程通常,我们的前端是在VsCode中开发的,......