新手 Vue 项目运行

前言:前面讲了我们已经将spingboot项目运行起来了,现在我们只需将后台管理的Vue项目运行起来即可完成整个项目。

在运行vue项目之前,请先运行springboot项目,运行步骤请看:运行Springboot + Vue 项目_springboot+vue项目怎么跑起来-CSDN博客

一、环境准备

在运行项目之前,确保运行vue项目的环境已经安装成功,并可以找到;

打开cmd命令行,按住win+R,出来命令行窗口,输入cmd,出来终端窗口

在终端中输入:node -v   ,得到nodejs的版本为13.14.0,如果高于这个版本可能会出现问题,请降低版本,如果有多个nodejs环境,可以安装node环境管理,nvm工具,请访问:使用nvm管理node多版本(安装、卸载nvm,配置环境变量) - 与f - 博客园

安装npm工具,输入下列语句:npm -v    ,出来版本号即安装成功;

二、Vue项目运行

2.1 回到Idea后端的springboot项目,找到src--> rescources --> front.front --> js --> config.js文件,打开之后找到 adminurl ,将adminurl修改为后台的运行路径:localhost://8081

var adminurl =  "http://localhost:8081";var cartFlag = falsevar chatFlag = false// 将其中的adminurl修改为后台访问地址
adminurl='http://localhost:8081'

在src --> main --> java --> com --> SpringbootSchemaApplication.java,双击这个文件,点击编辑器头部运行程序,如图所示;

 见到8080端口,表示后端springboot已经运行起来;接下去就是运行vue项目。

 

2.1 打开VSCode软件,导入vue项目文件夹

导入项目文件,目录如下:

2.2 打开终端命令行,以命令行的形式运行项目;在终端输入:

在终端中输入npm install ,下载vue依赖包

npm install

2.3 等待npm install 下载完成,看到  “added 49 packages from 9 contributors, removed 163 packages and updated 1386 packages in 340.918s” ,表示添加成功;

2.4 在终端中输入npm run serve,等待程序运行起来。

npm run serve

2.5 在浏览器中输入访问地址:http://localhost:8081,即可访问到平台;

2.6 至此,前端Vue程序已经运行起来,结合前面的spingboot项目,我们已经将整个springboot + Vue项目运行起来了。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/469073.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

光学全息详解

一、光学全息概述 1.1 光学全息的基本思想与原理的概述 光波是电磁波, 随时间振动,并在空间传播。光波照射物体时, 其振幅和相位就被空间调制。物光波的振幅给出物体的亮度(强度)信息, 相位给出物体的方位(深度和位置)信息。若能采用某种方法把物光波的振幅和相位同时记录下来…

自定义包和第三方包

1.自定义包由自己创建(创建步骤如下) 2.第三方包由大佬开发可通过python安装后自带的pip安装第三方包(安装时由于默认连接的是外网网速较慢,可换国内的网如(清华网):https://pypi.tuna.ysinghua.edu.cn/simple&#x…

SNH48 GROUP燃动杭州 第五届偶像运动会落下帷幕

2024年11月9日,“我们能赢”SNH48 GROUP第五届偶像运动会在杭州运河体育公园盛大开赛,本次运动会由高榕及SNH48郭爽、GNZ48梁娇作为赛事特邀主持人,并于小红书、微信视频号、SNH48 GROUP官方直播APP口袋48及MEET48全程直播。SNH48&#xff08…

Latex使用花体符号\mathbb{R}报错解决办法

一、背景 latex的优势是可以进行自动排版,以及复杂公式的编辑。然而,编辑花体符号R时,使用命令\mathbb{R}报错,编译不通过,这里记录一下解决办法。 二、Latex使用花体符号\mathbb{R}报错解决办法 在LaTeX中&#xf…

当当网创始人李国庆邀您:共襄创客匠人5000人“全球创始人IP领袖高峰论坛”

创客匠人正式官宣!当当网原CEO、联合创始人和首席大股东、CRYSTO董事长、CEO李国庆,受邀参加创客匠人5000人“全球创始人IP领袖高峰论坛”,将与我们携手共赴这场巅峰盛宴。 由创客匠人打造的“全球创始人IP领袖高峰论坛”将在2024年12月26日-…

docker安装zookeeper,以及zk可视化界面介绍

1. zookeeper 1.1. zookeeper简单介绍 ZooKeeper 是一个分布式的开源协调服务,最初由 Apache Hadoop 项目开发,用于构建分布式应用程序。它提供了一个简单的接口,允许开发人员实现诸如配置维护、域名服务、分布式同步、组服务等常见任务。Z…

SIwave:释放 SIwizard 求解器的强大功能

SIwave 是一种电源完整性和信号完整性工具。SIwizard 是 SIwave 中 SI 分析的主要工具,也是本博客的主题。 SIwizard 用于研究 RF、clock 和 control traces 的信号完整性。该工具允许用户进行瞬态分析、眼图分析和 BER 计算。用户可以将 IBIS 和 IBIS-AMI 模型添加…

Mac中禁用系统更新

Mac中禁用系统更新 文章目录 Mac中禁用系统更新1. 修改hosts,屏蔽系统更新检测联网1. 去除系统偏好设置--系统更新已有的小红点标记 1. 修改hosts,屏蔽系统更新检测联网 打开终端,执行命令: sudo vim /etc/hosts127.0.0.1 swdis…

macOS 下的 ARM 裸机嵌入式开发入门- 第二部分:实现第一个裸机应用并且调试

1、准备二进制运行程序镜像 利用 QEMU 仿真一个完整的系统,并创建最简单的“Hello world!”示例。 QEMU 模拟器支持 VersatilePB 平台,该平台包含一个 ARM926EJ-S 核心,以及其他外设,四个 UART 串行端口;特别是第一个…

分享三个python爬虫案例

一、爬取豆瓣电影排行榜Top250存储到Excel文件 近年来,Python在数据爬取和处理方面的应用越来越广泛。本文将介绍一个基于Python的爬虫程序,用于抓取豆瓣电影Top250的相关信息,并将其保存为Excel文件。 获取网页数据的函数,包括以…

怎么禁止Ubuntu自动更新升级

怎么禁止Ubuntu自动更新升级 笔者在做MIT 6.S081的时候发现他给我的qemu自动更新了又卡住了,故关闭了自动更新 文章目录 怎么禁止Ubuntu自动更新升级一、图形化修改二、基于命令行修改配置文件的方法 一、图形化修改 1.打开设置->软件和更新->更新 2.选择自…

论文1—《基于卷积神经网络的手术机器人控制系统设计》文献阅读分析报告

论文报告:基于卷积神经网络的手术机器人控制系统设计 摘要 本研究针对传统手术机器人控制系统精准度不足的问题,提出了一种基于卷积神经网络的手术机器人控制系统设计。研究设计了控制系统的总体结构,并选用PCI插槽上直接内插CAN适配卡作为上…

水库大坝安全监测预警方法

一、监测目标 为了确保水库大坝的结构安全性和运行稳定性,我们需要采取一系列措施来预防和减少因自然灾害或其他潜在因素所引发的灾害损失。这不仅有助于保障广大人民群众的生命财产安全,还能确保水资源的合理利用和可持续发展。通过加强大坝的监测和维护…

赖茅:“酱香酒+羽毛球”营销理念的先驱者与领航者

前言:贵州赖茅酒业有限公司成立于2014年,由贵州茅台酒股份有限公司与中石化易捷销售有限公司强强联合,引入民营资本组建。2018年签约成为世界羽联首家内地官方合作伙伴,突破白酒企业传统模式,创新打造“酱香酒&#xf…

二叉搜索树的应用(了解补充)

前言 前面我们对二叉搜索树进行了讲解,本节内容我们将对该树的应用进行讲解,对二叉搜素树进行进一步的了解。 二叉搜索树key和key/value使用场景 key搜索场景 只有key作为关键码,结构中只需要存储key即可,关键码即为需要搜索到的值…

Python 爬虫运行状态监控:进度、错误与完成情况

Python 爬虫运行状态监控:进度、错误与完成情况 在进行大规模数据爬取时,监控爬虫的运行状态至关重要。通过实时监控,可以了解爬虫的工作进度、出现的错误以及任务完成情况。这样可以及时发现并解决问题,确保数据抓取任务顺利进行…

Marin说PCB之1000-BASE-T1的PCB设计总结--01

上周末小编我从耶路撒冷出差回来,从浦东机场回来的路上和司机师傅聊了一会天,司机师傅说小伙子喜欢看脱口秀不?我说挺喜欢的,之前还看过上海这边的周立波的海派脱口秀呢,我记得还有一个综艺节目叫做一周立波秀&#xf…

[大模型]视频生成-Sora简析

参考资料: Sora技术报告https://openai.com/index/video-generation-models-as-world-simulators/4分钟详细揭密!Sora视频生成模型原理https://www.bilibili.com/video/BV1AW421K7Ut 一、概述 相较于Gen-2、Stable Diffusion、Pika等生成模型的前辈&am…

Prompt Engineering 提示工程

一、什么是提示工程(Prompt Engineering) Prompt 就是发给大模型的指令,比如讲个笑话、用 Python 编个贪吃蛇游戏等;大模型只接受一种输入,那就是 prompt。本质上,所有大模型相关的工程工作,都是…

python爬虫指南——初学者避坑篇

目录 Python爬虫初学者学习指南一、学习方向二、Python爬虫知识点总结三、具体知识点详解和实现步骤1. HTTP请求和HTML解析2. 正则表达式提取数据3. 动态内容爬取4. 数据存储5. 反爬虫应对措施 四、完整案例:爬取京东商品信息1. 导入库和设置基本信息2. 获取网页内容…