一文搞定node.js和Vue脚手架的介绍以及安装

news2024/9/28 5:31:11

node.js的介绍以及安装

node.js的介绍

node.js提供了前端程序的运行环境,可以把node.js理解成是运行前端程序的服务器。

node.js的安装

从官网下载安装即可:
	http://nodejs.cn/download/

image-20240712003226899

image-20240712003445914

image-20240712003457707

image-20240712003512519

image-20240712003529144

image-20240712003535622

不要勾选这个,否则会下载很多东西

image-20240712003554852

image-20240712003641352

node -v 是 查看node的版本

npm -v 是 查看npm版本

npm是安装工具的工具包,类似于Linux中yum,Linux中安装软件 yum install ,node中安装软件使用npm install

设置npm源 , 配置镜像后,下载资源就会很快.

image-20240712003724989

npm config set registry https://registry.npmmirror.com

12.3 使用node.js 安装 vue-cli

(管理员权限)使用如下命令安装vue-cli

npm install @vue/cli -g

# 如果出错,可以卸载,重新执行上一步安装
npm uninstall @vue/cli -g
  • npm: 使用node.js的命令
  • install: 安装
  • @vue/cli: 要安装的vue-cli
  • -g: 全局安装

更多操作当出现以下界面,表示正在安装:

image-20240712003951340

image-20240712004006282

安装vue-cli检测

12.4 使用vue-cli命令创建项目

进入工作空间,执行命令创建

  • vue create 项目名

注意bug: 创建项目时如果出现报错,提示no permitted 即没有权限在此处创建项目,这个是因为磁盘权限不够,需要修改硬盘权限

image-20240712004046737

image-20240712004055126

选择具体features

image-20240712004111230

选择vue版本

image-20240712004123846

一般选择第一项,为的是将文件分离打包

image-20240712004134488

是否将此操作存储为模板,本例选择n,选择为y就会在下次创建时使用

image-20240712004145292

创建完毕

image-20240712004157021

运行项目

image-20240712004207809

image-20240712004217681

12.5 使用图形界面方式创建

打开命令行,输入vue ui

image-20240712004245951

会自动打开浏览器,弹出页面

image-20240712004257204

创建项目

image-20240712004308921

image-20240712004315703

image-20240712004324662

选择插件

image-20240712004335369

选择版本

image-20240712004344557

开始创建

image-20240712004354983

创建成功后,跳转控制面板页面

image-20240712004404481

启动项目& 关闭

-1720716351260)]

开始创建

[外链图片转存中…(img-9MVIzHMn-1720716351260)]

创建成功后,跳转控制面板页面

[外链图片转存中…(img-vpbcwNUm-1720716351261)]

启动项目& 关闭

image-20240712004417037

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Ubuntu 22.04.4 LTS (linux) 安装 Auditd 安全审计

1 安装auditd sudo apt update sudo apt-get install auditd 2 修改配置 #sudo vim /etc/audit/auditd.conf #日志文件位置 log_file /var/log/audit/audit.log #日志文件大小(Mb) max_log_file 8 #日志文件数量 num_logs 53 启动服务 sudo systemctl restart aud…

【TOOLS】Chrome扩展开发

Chrome Extension Development 1. 入门教程 入门案例,可以访问【 谷歌插件官网官方文档 】查看官方入门教程,这里主要讲解大概步骤 Chrome Extenson 没有固定的脚手架,所以项目的搭建需要根据开发者自己根据需求搭建项目(例如通过…

前端工程化:Webpack配置全攻略

前端工程化:Webpack配置全攻略 前端小伙伴们,今天我们来聊聊那个让人又爱又恨的 Webpack。没错,就是那个配置起来让你想砸键盘,但又离不开它的构建工具。别担心,跟着我来,保证让你从 Webpack 小白变成配置…

【k8s部署elasticsearch】k8s环境下安装elasticsearch集群和kibana

文章目录 简介一.条件及环境说明二.需求说明三.实现原理及说明四.详细步骤4.1.规划节点标签4.2.创建三个statefulset和service headless配置4.3.创建service配置 五.安装kibana六.调整索引分区七.安装说明 简介 k8s集群中搭建有elasticsearch服务一般都会用到pvc,但…

苹果入局,AI手机或将实现“真智能”?

【潮汐商业评论/原创】 “AI应用智能手机不就是现在的AI手机。” 当被问到现阶段对AI手机的看法时,John如是说。“术业有专攻,那么多APP在做AI功能,下载用就是了,也用不着现在换个AI手机啊。” 对于AI手机,或许大多…

阿里云调整全球布局关停澳洲云服务器,澳洲服务器市场如何选择稳定可靠的云服务?

近日,阿里云宣布将关停澳大利亚地域的数据中心服务,这一决定引发了全球云计算行业的广泛关注。作为阿里云的重要海外市场之一,澳洲的数据中心下架对于当地的企业和个人用户来说无疑是一个不小的挑战。那么,在阿里云调整全球布局的…

JS爬虫实战之极验四代

极验四代滑块验证码 一、目标网站说明二、流程步骤1. 逆向步骤一般分为:2. 接口确认1- 确认流程2- 获取verify的参数3- 构建requests验证verify的参数4- 锁定secode参数的作用 ok,让我们去获取verify接口中的响应!!! 3…

在若依框架基础上开发新功能

本文介绍如何在若依框架(不分离版本)的基础上开发新功能。 目录 运行若依框架 下载若依框架代码 IDEA打开若依框架代码 初始化数据库 修改数据库配置 运行项目 设计数据库 数据表命名规则 建表及初始化数据 开发新功能 后端CRUD功能 前端接口…

YOLOv10改进 | 添加注意力机制篇 | 添加LSKAttention大核注意力机制助力极限涨点

一、本文介绍 在这篇文章中,我们将讲解如何将LSKAttention大核注意力机制应用于YOLOv10,以实现显著的性能提升。首先,我们介绍LSKAttention机制的基本原理,它主要通过将深度卷积层的2D卷积核分解为水平和垂直1D卷积核&#xff0…

网络编程!

网络编程 【1】网络开发架构 ( 1 ) C / S 架构 C : client (客户端) S: server (服务端) APP - 就是服务端 C/S 架构通过客户端软件和服务器之间的交互,实现了前端界面和后端业务逻辑的分离,提供了一种…

昇思学习打卡-8-计算机视觉/FCN图像语义分割

目录 FCN介绍FCN所用的技术训练数据的可视化模型训练模型推理FCN的优点和不足优点不足 FCN介绍 FCN主要用于图像分割领域,是一种端到端的分割方法,是深度学习应用在图像语义分割的开山之作。通过进行像素级的预测直接得出与原图大小相等的label map。因…

【JavaScript 算法】快速排序:高效的排序算法

🔥 个人主页:空白诗 文章目录 一、算法原理二、算法实现三、应用场景四、优化与扩展五、总结 快速排序(Quick Sort)是一种高效的排序算法,通过分治法将数组分为较小的子数组,递归地排序子数组。快速排序通常…

近期几首小诗汇总-生活~卷

生活 为生活飘零,风雨都不阻 路见盲人艰,为她心点灯 贺中科大家长论坛成立十五周年 科学家园有喜贺 园外丑汉翘望中 曾一学子入我科 正育科二盼长大 憧憬也能入此家 与科学家论短长 园外翘首听高论 发现有隙入此坛 竟然也能注册成 入园浏览惶然立 此贴…

使用ffmpeg将一个目录下的mkv格式的视频文件转换成mp4格式

最近学剪辑,从BT种子下载的素材资源都是mkv格式的,不能直接导入到视频剪辑软件中。这种情况下需要用一些格式转换工具进行转换,也可以使用ffmpeg进行编辑。 ffmpeg是一个命令行工具,用来对本地的音频视频软件进行编辑。ffmpeg我也…

【服务器】端口映射

文章目录 1.端口映射的概念1.1 端口映射的类型1.2 端口映射的应用场景1.3 示例 2.为什么要进行端口映射呢?3.原理3.1【大白话】原理解释3.2 原理图 4.代码 1.端口映射的概念 端口映射(Port Mapping),也称为端口转发(P…

萝卜快跑:未来出行的双刃剑

欢迎来到 破晓的历程的 博客 ⛺️不负时光,不负己✈️ 在这个日新月异的科技时代,无人驾驶技术正以前所未有的速度改变着我们的出行方式。萝卜快跑,作为自动驾驶出租车领域的佼佼者,其出现无疑为城市交通注入了新的活力&#xff…

[微信小程序知识点]自定义组件-拓展-外部样式类

使用组件时,组件使用者可以给组件传入css类名,通过传入的类名修改组件的样式 。 如果需要使用外部样式类修改组件的样式,在Component中需要用extemalClassess定义若干个外部样式类。 具体用法如下: (1)在Components文件里创建custom06组件 (…

谷粒商城实战笔记-26-分布式组件-SpringCloud-Gateway网关核心概念原理

微服务架构中,API网关扮演着至关重要的角色,它不仅作为微服务间的通信桥梁,还负责安全、监控、限流等职责。 一,网关的发展历程 SpringCloud的网关经历了两代的迭代和更替。 第一代网关是早期的Zuul,由 Netflix 开发…

【密码学】数字签名

一、数字签名的基本概念 数字签名是一种用于验证电子文档完整性和身份认证的密码学技术。它通过使用公钥加密体系中的私钥对文档的一部分(通常是文档的摘要)进行加密,从而创建一个“签名”。这个签名可以附在文档上,或作为一个单独…

巧用 VScode 网页版 IDE 搭建个人笔记知识库!

[ 知识是人生的灯塔,只有不断学习,才能照亮前行的道路 ] 巧用 VScode 网页版 IDE 搭建个人笔记知识库! 描述:最近自己在腾讯云轻量云服务器中部署了一个使用在线 VScode 搭建部署的个人Markdown在线笔记,考虑到在线 VScode 支持终…