Vue3-win7搭建vue3环境

news/2024/9/13 23:21:35/ 标签: vue, vue3, win7, vue, js

win7vue>vue3_0">Vue3-win7搭建vue>vue3环境

官方要求的信息是是node.js 18.03以上。而我的环境:win7 x64, vscode 1.34。

参考网址:

0、基本的安装
https://blog.csdn.net/m0_49139268/article/details/126159171
a、这里有各种安装包的下载路径(镜像)
https://blog.csdn.net/yangchangfu2016/article/details/138476607
b、这里提供了npm应该升级到哪个版本,并且提供了安装pnpm包的思路,但是我没使用;
https://blog.csdn.net/FeiChang27/article/details/136499241
c、安装和启动第一个项目
https://www.runoob.com/vue>vue3/vue>vue3-install.html

js_15">安装Node.js

下载和安装:

在这里插入图片描述

在网址上没有找到压缩包,所以下载了一个安装包:node-v13.14.0-x64.msi。
除了上面那个官网的网址,也可以在这里下载,这是国内的镜像,同时这里还有各个版本的压缩包。
https://registry.npmmirror.com/-/binary/node/v13.14.0/node-v13.14.0-x64.msi
安装到路径:D:\dev\nodejs下。
安装的过程中,有一个 勾选框 ,大概内容是,自动安装相关依赖,我没有勾选。
按照文档提示,安装好以后新建了两个目录:node_cache和node_global,如下图所示:
在这里插入图片描述

配置环境变量:

在用户的path里面增加:node_global的全路径和nodejs的安装路径:D:\dev\nodejs\node_global;D:\dev\nodejs
在环境标量中新建NODE_PATH,变量值为:D:\dev\nodejs\node_global\node_modules。
为此,在node_global目录下我又新建了一个node-modules目录。

测试:

打开命令行输入命令,如下图所示:

在这里插入图片描述

设置npm的registry(注册表)

因为我本地的是win7版本太低,所以安装会报错,所以改成将npm的register设置成新的镜像。(参考网址:https://blog.csdn.net/No_Name_Cao_Ni_Mei/article/details/135816328)
npm config set registry http://registry.npmmirror.com
手动修改npm的registry,我的路径是C:\Users\Administrator.npmrc 。 在命令行输入命令npm -h 会提示配置文件的位置,如下图所示:
在这里插入图片描述

恢复官方网址:npm config set registry https://registry.npmjs.org
查看设置是否成功:npm config get registry

#重点来了:升级node和npm

目的是将被不能安装在win7上的版本安装到win7上。
下载https://registry.npmmirror.com/-/binary/node/v16.3.0/node-v16.3.0-win-x64.zip
先删除nodejs安装根目录下所有文件,复制16.3.0版本的所有文件直接替换nodejs的安装根目录 。替换完成后,进入cmd,通过node -v 和 npm -v 查看node.js 和 npm版本。会提示如下图所示错误说明覆盖成功,接着操作。
在这里插入图片描述

新增系统环境变量:变量名:NODE_SKIP_PLATFORM_CHECK,变量值:1
在这里插入图片描述

下载node-v19.0.0-win-x86.zip解压后,先删除nodejs安装根目录下所有文件,复制19.0.0版本的所有文件直接替换nodejs的安装根目录 。替换完成后,进入cmd,通过node -v 和 npm -v 查看node.js 和 npm版本。
网址:https://registry.npmmirror.com/-/binary/node/latest-v19.x/node-v19.0.0-win-x86.zip

升级npm:

截止到(2024年8月25日)如果升级到最新的,会报错,提示需要node在20版本以上。没有测试用20版本的覆盖是否能够在win7上安装,因为我计划下一步直接安装win10的虚拟机,一步到位,方便省心。但是吧,好不容在win7上安装成功了,记下来才安心,毕竟也是心血。
此时我参考了上面的第二个网址,看到npm可以升级到9.6.3,于是执行下面的命令升级:
npm install npm@9.6.3 -g

vue>vue_71">创建vue>vue项目

参考了网址c:https://www.runoob.com/vue>vue3/vue>vue3-install.html
因为本地是win7所有没敢安装太高的版本,所以安装了3.1.0的环境。
npm init vue>vue@3.1.0
然后输入项目名称:runoob-vue>vue3-test ,其他的默认回车了,因为是测试项目。成功以后按照提示先后输入:
cd runoob-vue>vue3-test
npm install
npm run dev
在这里插入图片描述
在这里插入图片描述

输入 :npm run dev以后,根据屏幕提示,在网址上输入:http://localhost:3000 就可以打开测试项目了。
在这里插入图片描述
在这里插入图片描述

中间的hello world! 是我自己改的。
参考:https://code.visualstudio.com/docs/nodejs/vue>vuejs-tutorial,
在项目目录下,用命令行输入下面命令成功用vscode打开vue>vue项目。
“code .”
在这里插入图片描述

此时,在vscode中修改内容在网页上是能够体现出来的。
大体完成。


http://www.ppmy.cn/news/1515886.html

相关文章

ES详细使用!Elasticsearch实现索引操作,增删改查,批处理

要想知道ES怎么具体实现对数据的操作,我们首先应该了解一下什么叫做restful编码风格,因为es的具体操作都是restful风格的。 1.RESTful风格 RESTful 是一种软件架构风格,用于创建可扩展的网络服务。它使用 HTTP 方法(如 GET、POS…

【系统架构设计师-2018年】案例分析-答案及详解

试题一(25分) 阅读以下关于软件系统设计的叙述,在答题纸上回答问题1至问题3。 【说明】 某文化产业集团委托软件公司开发一套文化用品商城系统,业务涉及文化用品销售、定制、竞拍和点评等板块,以提升商城的信息化建设…

【ORACLE】 ORA-01691: Lob 段无法通过 8192 (在表空间 XXX_SPACE 中) 扩展

ORA-01691错误通常表示Oracle数据库在尝试扩展LOB段时无法为表空间分配更多的空间。这个问题通常由表空间容量不足引起。根据搜索结果,以下是几种可能的解决方案: 检查并扩大表空间:首先,确认表空间是否已经达到其最大容量。可以使…

Excel中的“块”操作

在Excel中,有offset、index、indirect三个对“区域”操作的函数,是较高版本Excel中“块”操作的利器。 (笔记模板由python脚本于2024年08月20日 19:25:21创建,本篇笔记适合喜欢用Excel处理数据的coder翻阅) 【学习的细节是欢悦的历程】 Pytho…

HarmonyOs应用权限申请,system_grant和user_grant区别。本文附头像上传申请user-grant权限代码示例

HarmonyOs应用权限申请,system_grant和user_grant区别。本文附头像上传申请user-grant权限代码示例 system_grant(系统授权) system_grant指的是系统授权类型,在该类型的权限许可下,应用被允许访问的数据不会涉及到用户…

状态压缩DP---最短Hamilton路径

给定一张 nn 个点的带权无向图,点从 0∼n−10∼n−1 标号,求起点 00 到终点 n−1n−1 的最短 Hamilton 路径。 Hamilton 路径的定义是从 00 到 n−1n−1 不重不漏地经过每个点恰好一次。 输入格式 第一行输入整数 nn。 接下来 nn 行每行 nn 个整数&a…

火绒使用详解 为什么选择火绒?使用了自定义规则及其高级功能的火绒,为什么能吊打卡巴斯基,360,瑞星,惠普联想戴尔的电脑管家等?

目录 前言 必看 为什么选择火绒? 使用了自定义规则及其高级功能的火绒,为什么能吊打卡巴斯基,360,瑞星,惠普联想戴尔的电脑管家等? 原因如下: 火绒的主要优势 1. 轻量化设计 2. 强大的自…

wsl2 airsim wairing for connect (Windows11 UE4.27)问题解决

一、概述 这里记述我遇到我在使用wsl2子系统与Windows11上进行交互时候,遇到的一些我之前没有遇到过的问题。 之前的我写的配置链接在这里。 UE5 with plugins AirSim in Windows & ROS in WSL2-Ubuntu 20.04配置过程记录_airsim ue5-CSDN博客文章浏览阅读455次…

python循环访问excel的某一列从某行开始的内容

python循环访问excel的某一列从某一行开始的内容 您可以使用openpyxl库来实现这个需求。以下是一个示例代码,展示了如何使用openpyxl读取Excel文件中的特定列(假设为第一列,从第二行开始): 可以使用Python的openpyxl…

FastAPI+Vue3零基础开发ERP系统项目实战课 20240824上课笔记 循环和函数以及大量的练习

巩固一下 假设我们现在想要根据输入月份,判断是哪个季节,怎么做呀? 输入1:一月,12月,1月,2月是冬季 输入8:八月,夏季 作为思考题,有时间就做一下&#xff…

【HTML】为网页添加列表和超链接

1、列表 1.1、无序列表 <ul><li>列表项1</li><li>列表项2</li><li>列表项3</li> ...... </ul>无序列表的常用type属性值 1.2、有序列表 <ol><li>列表项1</li><li>列表项2</li><li>列…

GGD光伏电站低压并网柜,分布式光伏并网配电柜

作为光伏低压并网柜的厂家之一&#xff0c;江苏中盟电气集团以下为您分享关于分布式光伏发电中用到的低压并网柜&#xff08;并网配电柜&#xff09;的内容。 实际上GGD光伏低压并网柜&#xff0c;只是众多型号并网柜中的一种&#xff0c;它们以低压交流配电柜为基础&#xff…

Linux-远程访问及控制

系列文章目录 提示&#xff1a;仅用于个人学习&#xff0c;进行查漏补缺使用。 1.Linux-网络设置 2.Linux-DHCP服务、vsftp 3.Linux-DNS域名解析服务 提示&#xff1a;写完文章后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录 系列文章目录…

排查Maven问题的步骤

0.检查pom文件完整性 1.检查IDEA中配置是否正确 2.使用清楚工具将所有的lastupdate清除, 3.有些依赖是公司的依赖 —>配置私服 —>拷贝同事仓库,覆盖自己的仓库 4.有了私服地址,但是还是下载不到 —>查看地址是否能访问 —>挂VPN

ISP 3A 算法:自动曝光(AE)中的平均亮度法详解

在自动曝光&#xff08;AE&#xff09;算法中&#xff0c;平均亮度法是一种经典且广泛应用的技术。它通过计算场景中所有像素的平均亮度来确定最佳曝光设置&#xff0c;从而保证图像的整体亮度处于适当的水平。尽管该方法相对简单&#xff0c;但它在AE算法中扮演着重要的角色&a…

React+Vis.js(07):vis.js设置关系网络图禁止缩放和设置关系的指向和名称

文章目录 设置关系图禁止缩放设置关系图的关系指向和关系名称设置关系图的关系指向:方式一设置关系图的关系指向:方式二设置关系显示的标签设置关系图禁止缩放 在 vis.js 中,你可以通过设置 interaction 配置项中的 zoomView 属性为 false 来禁止缩放功能。这样,用户将无法…

SQL Server数据库 创建表,和表的增删改查

打开SQL Server工具,连接服务器 右击数据库&#xff0c;创建新的数据库 新建表 填写列&#xff0c;我添加了Id,Name,Sex,Age,和class列 右键表刷新一下就有了 我又同时创建了一个Class表 点击新建查询&#xff0c;现在写代码添加数据&#xff0c;也可以操作表来对数据进行添加 …

Vim youcompleteme Windows 安装保姆级教程

不说废话。 准备 检查 Vim 的 Python 配置 安装好 vim 和 python 后&#xff08;python 必须 ≥ \ge ≥ 3.6&#xff09;&#xff0c;在 cmd 下运行 vim --version会弹出以下窗口。 如果发现 python/dyn 和 python3/dyn 都是 - &#xff08;我不知道只有前者是 能不能运行…

日志审计-graylog ssh登录超过6次告警

Apt 设备通过UDP收集日志&#xff0c;在gray创建接收端口192.168.0.187:1514 1、ssh登录失败次数大于5次 ssh日志级别默认为INFO级别&#xff0c;通过系统rsyslog模块处理&#xff0c;日志默认存储在/var/log/auth.log。 将日志转发到graylog vim /etc/rsyslog.conf 文件末…

第133天:内网安全-横向移动域控提权NetLogonADCSPACKDC永恒之蓝

案例一&#xff1a;横向移动-系统漏洞-CVE-2017-0146 这个漏洞就是大家熟悉的ms17-010&#xff0c;这里主要学习cs发送到msf&#xff0c;并且msf正向连接后续 原因是cs只能支持漏洞检测&#xff0c;而msf上有很多exp可以利用 注意msf不能使用4.5版本的有bug 这里还是反弹权…