Spring Boot中Node.js的下载与Vue CLI在IDEA中的部署及使用(图文解释 简单易懂)

简介: Spring Boot中Node.js的下载与Vue CLI在IDEA中的部署及使用(图文解释 简单易懂)

仍有问题可点赞关注收藏后在评论区留言~~~

一、Node.js与npm的下载

在使用Vue CLI(Vue脚手架)搭建前端系统的时候,因为需要用到npm安装Vue CLI,而npm是集成在Node.js中的,所以需要首先安装Node.js

Node.js官网

下载过程很简单,一路next就可以了,下载完成后在命令行窗口输入以下命令检测是否安装成功

node -v 检测Node.js是否安装成功

npm -v 检测npm是否安装成功

同样可以输入npm -g install npm将npm更新到最新版本

二、IDEA中安装Vue CLI

在IDEA中 在终端命令行使用npm i -g vue-cli安装Vue脚手架

如果出现以下的报错 请参考我这篇博客解决

解决脚本文件运行不了

安装完成之后可以输入vue -V查看版本检测是否安装成功

Vue脚手架安装成功后就可以初始化webpack包结构,在IDEA终端中继续输入命令

vue init webpack cardmis-vue(你自己的项目名字)

然后进行如下设置

初始化完成后显示如下信息

然后在终端中依次输入命令

cd cardmis-vue(你自己项目的名字)

npm run dev

启动Vue项目 完成后 将提示通过哪个端口进行访问

接下来点击图中网址就可以启动Vue项目(或者在浏览器中输入该网址)

效果如下

至此 部署以及使用完成

相关文章
|
2月前
|
网络协议 Windows
两步带你解决IDEA 插件下载安装慢、超时、不成功问题
这篇文章提供了解决IDEA插件下载慢或超时问题的方案,通过查找国内插件节点IP地址并修改本地hosts文件来加速下载。
两步带你解决IDEA 插件下载安装慢、超时、不成功问题
|
1月前
|
JavaScript
Vue CLi脚手架创建第一个VUE项目
Vue CLi脚手架创建第一个VUE项目
35 3
|
1月前
|
运维 网络安全 持续交付
IDEA+Docker 远程一键部署项目:技术干货分享
【10月更文挑战第4天】在现代软件开发中,快速、可靠、自动化的部署流程是提升开发效率和运维质量的关键。IDEA(IntelliJ IDEA)作为Java开发者首选的IDE,结合Docker这一轻量级容器化技术,能够实现远程一键部署项目,极大地简化了开发到生产的流程。今天,我将和大家分享这一组合在工作学习中的实际应用和技术干货。
211 3
|
3月前
|
消息中间件 JavaScript 中间件
函数计算产品使用问题之WebIDE编写的Node.js代码是否会自动进行打包部署
函数计算产品作为一种事件驱动的全托管计算服务,让用户能够专注于业务逻辑的编写,而无需关心底层服务器的管理与运维。你可以有效地利用函数计算产品来支撑各类应用场景,从简单的数据处理到复杂的业务逻辑,实现快速、高效、低成本的云上部署与运维。以下是一些关于使用函数计算产品的合集和要点,帮助你更好地理解和应用这一服务。
|
2天前
|
资源调度 前端开发 JavaScript
vite3+vue3 实现前端部署加密混淆 javascript-obfuscator
【11月更文挑战第10天】本文介绍了在 Vite 3 + Vue 3 项目中使用 `javascript-obfuscator` 实现前端代码加密混淆的详细步骤,包括安装依赖、创建混淆脚本、修改 `package.json` 脚本命令、构建项目并执行混淆,以及在 HTML 文件中引用混淆后的文件。通过这些步骤,可以有效提高代码的安全性。
|
5天前
|
前端开发 JavaScript 安全
vite3+vue3 实现前端部署加密混淆 javascript-obfuscator
【11月更文挑战第7天】本文介绍了在 Vite 3 + Vue 3 项目中使用 `javascript-obfuscator` 实现前端代码加密混淆的详细步骤。包括项目准备、安装 `javascript-obfuscator`、配置 Vite 构建以应用混淆,以及最终构建项目进行混淆。通过这些步骤,可以有效提升前端代码的安全性,防止被他人轻易分析和盗用。
|
1月前
|
Java Maven Spring
springboot学习一:idea社区版本创建springboot项目的三种方式(第三种为主)
这篇文章介绍了在IntelliJ IDEA社区版中创建Spring Boot项目的三种方法,特别强调了第三种方法的详细步骤。
233 0
springboot学习一:idea社区版本创建springboot项目的三种方式(第三种为主)
|
1月前
|
JavaScript 前端开发
|
1月前
|
JavaScript
【小白懂系列】Vue CLi脚手架创建第一个VUE项目
【小白懂系列】Vue CLi脚手架创建第一个VUE项目
32 2
|
1月前
|
Java 应用服务中间件 Maven
idea+maven+tomcat+spring 创建一个jsp项目
这篇文章介绍了如何在IntelliJ IDEA中使用Maven和Tomcat创建一个JSP项目,包括配置Maven依赖、设置Tomcat服务器、编写JSP页面、创建控制器和配置文件,以及项目的运行结果。
152 0
idea+maven+tomcat+spring 创建一个jsp项目