从零到一nvm、npm、cnpm、yarn、vue全套安装和环境配置以及创建新项目和如何运行人家的项目大全,最详细,保姆级

简介: 从零到一nvm、npm、cnpm、yarn、vue全套安装和环境配置以及创建新项目和如何运行人家的项目大全,最详细,保姆级

NVM

1.下载

下载地址:Releases · coreybutler/nvm-windows · GitHub  可能需要开启魔法

划到下面。找到如图所示的文件下载即可2.

2.安装(要记住安装的路径)

基本一键默认即可,你要修改路径也可以,但不建议

下载好后输入以下命令,如果出现版本号即成功安装

3.配置信息

根据之前下载的路径进入到setting文件配置以下信息

node_mirror: https://npm.taobao.org/mirrors/node/

npm_mirror: https://npm.taobao.org/mirrors/npm/

4.环境变量

通常已经设置好了,如果没有的话可以自己按照着添加

 

 

Nodejs

1.下载

通过命令

nvm install <对应的版本>

2.使用

nvm user <对应的版本>

3.配置全局依赖

进入到nvm的安装路径,在下载好的node的版本里找到node_modules然后创建以下两个目录

然后再去到环境变量里的PATH 里面创建一个新的环境变量,路径是node_global这个文件的路径

NPM配置

1.查看配置

npm config ls

 

2.配置对应路径

分别按照以下命令进行配置

npm config set prefix "C:\Program Files\nodejs\node_modules\node_global"

npm config set cache "C:\Program Files\nodejs\node_modules\node_cache"

registry=https://registry.npm.taobao.org

 

下载cnpm

npm install -g cnpm --registry=https://registry.npm.taobao.or

下载yarn

1.安装yarn工具

npm install -g yarn

2.配置文件

yarn config get registry 获取当前镜像源

yarn config set registry http://registry.npm.taobao.org/ 设置淘宝镜像源

 

下载vue

1.下载

npm install -g @vue/cli  或者 yarn global add @vue/cli

这里我是采用的npm命令

2.环境变量配置

 

前面已经配置过npm的其实已经算是也把vue配置好了但如果还是显示命令不存在可以看以下步骤

1.找到vue存在的路径

新建一个NPM_HOME,复制进去

然后在Path里再配置以下的信息

vue -V查看配置信息

 

小提示:用vue创建项目或者用npm初始化项目的时候的报错可以换cnpm尝试

 

如何在运行人家的vue项目

1.删除文件

通常人家编译好的项目是会已经有了node_modules和一个package-lock.json文件,package-lock.json记录了整个node_moudles文件夹的树状结构因此如果不删除的话容易导致npm版本不一致

2. 在项目终端运行cmd窗口

3.清除npm缓存

npm cache clean -force

4.按照自己的npm重新安装依赖

npm install

5.运行项目

npm run serve

 

目录
相关文章
|
16天前
|
存储 资源调度 JavaScript
一文带你了解PNPM以及 npm,yarn,pnpm区别
一文带你了解PNPM以及 npm,yarn,pnpm区别
|
3月前
|
JavaScript 安全 测试技术
vue封装组件发布到Npm
【10月更文挑战第17天】
|
3月前
|
移动开发 小程序 数据可视化
基于npm CLI脚手架的uniapp项目创建、运行与打包全攻略(微信小程序、H5、APP全覆盖)
基于npm CLI脚手架的uniapp项目创建、运行与打包全攻略(微信小程序、H5、APP全覆盖)
408 3
|
3月前
|
缓存 资源调度 前端开发
Yarn学习,Yarn安装,Yarn常用命令。这一篇即可(有需要再补充)
Yarn 是一个快速、可靠、安全的 JavaScript 包管理工具,旨在解决 npm 的一些不足之处。
110 5
|
3月前
|
缓存 前端开发 JavaScript
前端架构思考:代码复用带来的隐形耦合,可能让大模型造轮子是更好的选择-从 CDN 依赖包被删导致个站打不开到数年前因11 行代码导致上千项目崩溃谈谈npm黑洞 - 统计下你的项目有多少个依赖吧!
最近,我的个人网站因免费CDN上的Vue.js包路径变更导致无法访问,引发了我对前端依赖管理的深刻反思。文章探讨了NPM依赖陷阱、开源库所有权与维护压力、NPM生态问题,并提出减少不必要的依赖、重视模块设计等建议,以提升前端项目的稳定性和可控性。通过“left_pad”事件及个人经历,强调了依赖管理的重要性和让大模型代替人造轮子的潜在收益
|
3月前
|
缓存 资源调度 JavaScript
npx与npm的差异解析,以及包管理器yarn与Node版本管理工具nvm的使用方法详解
npx与npm的差异解析,以及包管理器yarn与Node版本管理工具nvm的使用方法详解
100 0
|
4月前
|
JavaScript
使用npm,快速构建第一个vue项目
本文介绍了如何使用npm快速构建第一个Vue项目。步骤包括确保安装了Node.js并且配置了正确的环境变量,创建一个空文件夹并使用VSCode打开,通过VSCode的终端执行`npm init vue@latest`命令以初始化项目,选择默认配置即可。接着安装项目依赖并启动开发服务器,最后通过浏览器访问开发服务器提供的本地地址查看项目运行结果。文章还提供了相关代码和操作截图。
|
4月前
|
缓存 JavaScript 前端开发
8种方法解决vue创建项目报错:command failed: npm install --loglevel error
该文章提供了八种解决Vue项目创建时遇到的`command failed: npm install --loglevel error`错误的方法,包括清理缓存、更换npm源、重新安装Node.js等措施。
8种方法解决vue创建项目报错:command failed: npm install --loglevel error
|
5月前
|
资源调度 Linux iOS开发
GPT栏目:yarn 安装
本文提供了在Windows、macOS和Linux操作系统上安装yarn的详细步骤,包括通过Windows安装程序、使用Homebrew在macOS上安装,以及通过包管理器在不同Linux发行版上安装yarn,并验证安装是否成功。
GPT栏目:yarn 安装
|
5月前
|
资源调度 前端开发 JavaScript
谈后端人眼里的 nvm、yarn、pnpm……
虽然我是做后端的,但也时常关注前端,只是最近觉得前端的各种工具名称太眼花缭乱了,nvm、yarn、pnpm、taro……
47 4

推荐镜像

更多