VUE+SpringBoot的环境搭建及安装

本文详细介绍了如何安装和配置Vue.js与SpringBoot的开发环境,包括node.js的安装、Vue的全局设置、Vue插件的安装以及后台SpringBoot项目在IDEA中的创建。此外,还讲解了如何在Vue项目中安装axios组件,并提供了在IDEA中创建后台项目的基本步骤,涵盖了数据库连接、接口创建和测试。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

node.js安装

1.下载并安装node.js,https://nodejs.org/en/download/node-v14.16.0-x64.msi 安装目录:D:\develop\nodejs
2.在nodejs安装路径下,新建node_global和node_cache两个文件夹
在这里插入图片描述
3.设置缓存文件夹:npm config set cache "D:\develop\nodejs\node_cache“
4.设置全局模块存放路径:设置nodejs prefix(全局)
npm config set prefix “D:\develop\nodejs\node_global”
5.npm install -g cnpm --registry=https://registry.npm.taobao.org
注:npm命令
npm -v 来测试是否成功安装
查看当前目录已安装插件:npm list
更新全部插件: npm update [ --save-dev ]
使用 npm 更新对应插件: npm update [ -g ] [ --save-dev]
使用 npm 卸载插件: npm uninstall [ -g ] [ --save-dev ]

VUE安装

我们对Markdown编辑器进行了一些功能拓展与语法支持,除了标准的Markdown编辑器功能,我们增加了如下几点新功能,帮助你用它写博客:
1.安装Vue:cnpm install vue -g
2. 安装vue命令行工具,即vue-cli 脚手架 :npm install -g @vue/cli
3. 注:卸载vue-cli: npm uninstall -g vue-cli
4. path系统环境变量中添加路径:
C:\vue\nodejs\node_global
C:\vue\nodejs
5.在命令行中输入:vue ui来创建vue项目

VUE插件安装

  1. element ui:在vue图形界面中搜索插件
    在这里插入图片描述
  2. 可以安装其他插件在这里插入图片描述

后台SpringBoot在IDEA里的设置和安装

安装axios组件

在命令行中 运行vue add axios

在IDEA里创建一个后台项目

  1. New Project
  2. 选择安装的插件
    在这里插入图片描述
  3. 在resources里的application添加链接数据库信息,记得改为.yml格式
  4. 新建一个类与数据库里的表对应
  5. 创建接口继承JPA
  6. 测试接口
  7. 创建controller handler使外部可以通过浏览器URL访问
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值