Vue Yarn npm nodejs - 安装、配置

一、安装 node.js

　　1、从node.js官网下载并安装，安装时，安装路径可以修改为非C盘

 

　　2、使用 node --version 命令在 CMD 中查看 nodejs 安装的版本，显示了安装的版本号，代表安装成功

 

二、npm 配置

　　安装 node.js 会自带 npm，可通过 npm --version 查看版本，能查看到版本代表已安装并且配置正确。当使用npm安装全局的组件时，会默认安装在 C:\Users\用户名\AppData\Roaming\npm 中，缓存则放在 C:\Users\用户名\AppData\Roaming\npm-cache 中，为了让npm安装到非C盘，虽然占不了太多的空间，但可能需要这样操作，操作如下：

　　1、在 D:\ProgramData 中新建 nodejs 文件夹

　　2、在 nodejs 中新建 npm_global 和 npm_cache

　　3、使用 npm config set 来设置 prefix 和 cache

npm config set prefix "D:\ProgramData\nodejs\npm_global"
npm config set cache "D:\ProgramData\nodejs\npm_cache"

　　4、修改环境变量

　　　　1）设置 -> 系统 -> 关于 -> 高级系统设置 -> 环境变量... (这个路径因系统而已，系统为 win11 21H2)

　　　　2）在系统变量的Path中添加  D:\ProgramData\nodejs\npm_global 和 D:\ProgramData\nodejs\npm_global\bin 两个路径

　　　　3）保存应用并重启计算机

三、修改npm镜像

　　由于npm默认使用的镜像在国外，可能会有慢不稳定的情况，可以修改镜像为淘宝镜像，CMD 执行

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

 

可以通过 npm config 命令查看 npm 配置信息，prefix、cache 和 registry 信息已成功修改

npm config ls

 

三、安装 yarn，安装了 node.js 之后，使用npm进行安装

　　1、安装

npm install -g yarn

　　2、查看版本

yarn --version

 

四、yarn 配置

　　1、在 D:\ProgramData 中新建 nodejs 文件夹

　　2、在 nodejs 中新建 yarn_global 和 yarn_cache

　　3、使用 npm config set 来设置 global-folder 和 cache-folder

yarn config set global-folder "D:\ProgramData\nodejs\yarn_global"
yarn config set cache-folder "D:\ProgramData\nodejs\yarn_cache"

　　4、修改环境变量

　　　　1）设置 -> 系统 -> 关于 -> 高级系统设置 -> 环境变量... (这个路径因系统而已，系统为 win11 21H2)

　　　　2）在系统变量的Path中添加  D:\ProgramData\nodejs\yarn_global 路径

　　　　3）保存应用并重启计算机

可以通过 yarn config list 查看 yarn 配置信息

yarn config list

 

五、安装vue/cli

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

使用时发生无法加载文件 ...vue.ps1 ...   请使用管理员权限打开 PowerShell 执行以下命令，然后输入 Y 确认：

set-ExecutionPolicy RemoteSigned

 

特别注意：文件路径不要包含空格 

如果权限不够，可以使用管理员打开CMD 

修改了npm和yarn的默认配置，如果存在没有权限问题，需要修改这些文件夹的权限为可修改（当前用户，或所有用户，请自行搜索）

版本信息：

Windows：win11 21H2

node：v16.14.2

npm：8.5.0

yarn：1.22.18

vue/cli: 5.0.4