Spring boot + Vue2小项目基本模板

Spring boot + Vue2小项目基本模板

基本介绍

复制代码
项目来源哔哩哔哩的青戈,跟着学习搭建自己的简单vue小项目;看别人的项目总觉得看不懂,需要慢慢打磨
这里目前只简单的搭建了菜单导航和表格页面,还未搭建登录页面,待补充

视频链接

基本环境安装

复制代码
需要安装node.js(自带npm),然后配一下镜像
	npm config set registry https://registry.npm.taobao.org

安装Vue@cli,Vue的脚手架进行项目的创建
	npm install -g @vue/cli

采用Vue create demo01,进行项目的基本创建,这里采用的是Vue2版本

这个项目里面使用了基本的组件,包括路由、element-ui,安装如下:
	npm i element-ui -S
	npm install vue-router@3

开发环境采用的是VS Code,比较容易配置,安装组件需要在创建项目的目录内

安装示例:

项目搭建

复制代码
安装好环境,创建了基本模板后,需要修改(替换)一下原有内容

vue.config.js的内容(增加一句 lintOnSave: false(对组件名称定义不进行限制))

javascript 复制代码
const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
    transpileDependencies: true,
    lintOnSave: false
})

替换自动生成的public和src目录

复制代码
gitee的链接
	https://gitee.com/anxwefndu/springboot-vue2demo01.git

最终效果展示

当前简单的菜单和表格,还没有加上登录与具体各栏目分类

相关推荐
ym hyd 1111 小时前
试题库管理系统源码 Java+SpringBoot+Vue3 前后分离
java·vue.js·spring boot·毕设
雪芽蓝域zzs7 小时前
第4节:el-select 弹窗事件控制(打开 / 关闭、选中事件、弹窗滚动事件)
vue.js·elementui
小蒜学长9 小时前
校园社团招新网站的设计与实现(代码+数据库+LW)
java·数据库·spring boot·后端·校园社团招新网站
卓怡学长12 小时前
w192基于springboot“考研情报站”微信小程序设计与实现
java·spring boot·spring·微信小程序·intellij-idea
web打印社区15 小时前
HTML5 静默打印:前端页面怎么调用打印机且尽量不弹窗
前端·javascript·vue.js·pdf·html·html5
ym hyd 11115 小时前
宝宝早教服务系统源码 Java+SpringBoot+Vue3 前后分离
java·开发语言·spring boot
雪芽蓝域zzs16 小时前
第3节:el-select 弹窗定位、滚动穿透与挂载容器(popper-append-to-body /teleported)
vue.js·elementui
FYKJ_201016 小时前
SSM校园互助与闲置交易平台62145-计算机课程设计、毕业设计
java·spring boot·python·mysql·架构·spark·课程设计
卓怡学长17 小时前
w193基于springboot“乐通黄骅”电动车智能充电服务小程序
java·spring boot·spring·小程序·intellij-idea
雪芽蓝域zzs1 天前
第 2 节:基础扩展 - 下拉弹窗常用原生属性
vue.js·elementui