nodejs安装cnpm、nrm、webpack

nodejs更换npm默认安装路径

查看包路径

npm config ls

image-20210426105356546

NPM默认的管理包路径在C:/用户/[用户名]/AppData/Roming/npm/node_modules,为了方便对依赖包管理,我们将管理包的路径设置在单独的地方,本教程将安装目录设置在node.js的目录下,创建npm_modules和npm_cache,执行下边的命令:

npm config set prefix "C:\Program Files\nodejs\npm_modules" npm config set cache "c:\Program Files\nodejs\npm_cache"

image-20210426105607399

安装cnpm

cnpm是淘宝的镜像

输入命令,进行全局安装淘宝镜像。
npm install -g cnpm --registry=https://registry.npm.taobao.org

安装后,我们可以使用以下命令来查看cnpm的版本

image-20210426105716888

通过改变地址使用淘宝镜像

npm的默认地址是https://registry.npmjs.org/

可以使用npm config get registry查看npm的仓库地址

可以使用npm config set registry https://registry.npm.taobao.org来改变默认下载地址,达到可以不安装cnpm就能采用淘宝镜像的目的,然后使用上面的get命令查看是否成功。

-g -S -D

-g:全局安装。 将会安装在C:\ Users \ Administrator \ AppData \ Roaming \ npm,并且写入系统环境变量;非全局安装:将会安装在当前定位目录;全局安装可以通过命令行任何地方调用它,本地安装将安装在定位目录的node_modules文件夹下,通过要求调用;

-S:即``npm install module_name --save``,写入package.json的dependencies ,dependencies 是需要发布到生产环境的,比如jq,vue全家桶,ele-ui等ui框架这些项目运行时必须使用到的插件就需要放到dependencies

-D:即npm install module_name --save-dev,写入package.json的devDependencies ,devDependencies 里面的插件只用于开发环境,不用于生产环境。比如一些babel编译功能的插件、webpack打包插件就是开发时候的需要,真正程序打包跑起来并不需要的一些插件。

为什么要保存在package.json 因为node_module包实在是太大了。用一个配置文件保存,只打包安装对应配置文件的插件,按需导入。

安装nrm

nrm命令可以查看当前使用的镜像

nrm包安装命令: npm i nrm -g

nrm能够管理所用可用的镜像源地址以及当前所使用的镜像源地址,但是只是单纯的提供了几个url并能够让我们在这几个地址之间方便切换

nrm ls即nrm list,查看所有可用的镜像,并可以切换。*号表示当前npm使用的地址,可以使用命令nrm use taobao或 nrm use npm来进行两者之间的切换。

image-20210426110034774

注意该步骤中可能出现错误

nrm报错 code: ‘ERR_INVALID_ARG_TYPE‘解决方法

找到nrm安装目录打开cli.js 第17行修改成

//const NRMRC = path.join(process.env.HOME, '.nrmrc'); (删除) const NRMRC = path.join(process.env[(process.platform == 'win32') ? 'USERPROFILE' : 'HOME'], '.nrmrc');

保存后重新打开命令行,可正常运行nrm ls命令

安装webpack

在开始之前,请确保安装了 Node.js 的最新版本。使用 Node.js 最新的长期支持版本(LTS - Long Term Support),是理想的起步。使用旧版本,你可能遇到各种问题,因为它们可能缺少 webpack 功能以及/或者缺少相关 package 包。

要安装最新版本或特定版本,请运行以下命令之一:

npm install --save-dev webpack npm install --save-dev webpack@<version>

如果你使用 webpack 4+ 版本,你还需要安装 CLI。

npm install --save-dev webpack-cli

对于大多数项目,我们建议本地安装。这可以使我们在引入破坏式变更(breaking change)的依赖时,更容易分别升级项目。通常,webpack 通过运行一个或多个 npm scripts,会在本地 node_modules 目录中查找安装的 webpack:

"scripts": { "start": "webpack --config webpack.config.js" }

当你在本地安装 webpack 后,你能够从 node_modules/.bin/webpack 访问它的 bin 版本。

全局安装

以下的 NPM 安装方式,将使 webpack 在全局环境下可用:

npm install --global webpack

不推荐全局安装 webpack。这会将你项目中的 webpack 锁定到指定版本,并且在使用不同的 webpack 版本的项目中,可能会导致构建失败。

查看是否安装成功

image-20210426110726160

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wppjyj.html