一：npm是什么？
程序员自古以来就有社区文化，社区的意思是：拥有共同职业或兴趣的人们，自发组织在一起，通过分享信息和资源进行合作。虚拟社区的参与者经常会在线讨论相关话题，或访问某些网站。
前端程序员也有社区，世界上最大的前端社区应该就是 GitHub了。前端通过 GitHub来
- 分享源代码（线上代码仓库）
- 讨论问题（Issue 列表）
- 收集学习资源和常去的网站（比如我收集的优质中文前端博客）
加入社区最大的好处之一是，你可以使用别人贡献的代码，你也可以贡献代码给别人用。
问题来了，共享代码：前端是怎么共享代码的呢？
在 GitHub还没有兴起的年代，前端是通过网址来共享代码。比如你想使用 jQuery，那么你点击jQuery网站上提供的链接就可以下载jQuery，放到自己的网站上使用。
当一个网站依赖的代码越来越多，程序员发现这是一件很麻烦的事情：
- 去 jQuery 官网下载 jQuery
- 去 BootStrap 官网下载 BootStrap
- 去 Underscore 官网下载 Underscore
……
有些程序员就受不鸟了，一个拥有三大美德的程序员 Isaac Z. Schlueter （以下简称 Isaaz）给出一个解决方案：用一个工具把这些代码集中到一起来管理吧！
这个工具就是他用 JavaScript （运行在 Node.js 上）写的npm，全称是Node Package Manager。npm自node.js v0.6.x版以后就内嵌在node.js中，所以要安装npm，安装node.js就可以了。
简单一句话：npm就是类似iOS的cocopods工具
作为前端开发者，node和npm安装必不可少。然而有时会因为安装新的app（如MacPorts，慎装，它会修改基本环境变量以及npm的全局设置等）导致版本环境混乱，有2种方式有效管理：
特别推荐安装安装nvm来管理Node版本；
其次推荐Homebrew来对node和npm版本进行管理。
本次介绍，不用这些去管理npm,直接去官网下载npm包，安装就行。
二：如何安装？
大概有两个方法：
①下载
Node.js的apk安装包
②利用brew安装
③利用nvm安装
方法1：下载 Node.js的apk安装包
1，下载 Node.js中文网apk安装包
image.png
2，像安装其他软件一样安装即可
image.png
3，安装好后在终端查看是否安装成功
npm -v
//我这里是打印 7.20.3 最新好像是7.20.6
node -v
//我这里是打印 16.4.0
4，npm install
这步就是类似iOS的cocopods的pod install。
如果有报错什么的，再去百度
5，运行项目
npm run dev
//或者命令
npm start
方法2：利用brew安装
brew install node
查看npm的最新版本
npm -g outdated
image.png
更新到最新的版本
sudo npm -g install [email protected]
若更新过程中报错, 将这个路径下面的.npm.DELETE文件夹删除， 重新安装即可
ENOTEMPTY: directory not empty, rename '/usr/local/lib/node_modules/npm' -> '/usr/local/lib/node_modules/.npm.DELETE'
这个过程中也可能会遇到下面的错误
-bash: /usr/local/bin/npm: No such file or directory
执行下面的四句命令， 重新安装一下node即可
$ brew update
$ brew uninstall node
$ brew install node
$ sudo brew postinstall node
# brew error message provided this recommendation; only worked with sudo
方法3：利用nvm安装
首先安装nvm。
1.使用curl或wget安装nvm
curl -L -o- [http://build.sankuai.com/nvm/install](http://build.sankuai.com/nvm/install) | bash
上述失败了的话试试这个：
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.32.1/install.sh | bash
上述再失败了的话试试这个：
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.2/install.sh | bash
nvm 常用命令
nvm install xxx //安装xxx版本号
nvm use xxx //设置使用xxx版本号
nvm ls //所有已安装的node版本号
nvm alias default v10.16.0 //nvm设置默认node版本号
安装node及npm
nvm install v8.5.0
将镜像源设置为淘宝镜像
export NVM_NODEJS_ORG_MIRROR=https://npm.taobao.org/mirrors/node
npm --registry=https://registry.npm.taobao.org
三： 诡异报错和处理方法
命令：
npm run dev
报错：
Error: Cannot find module 'webpack/bin/config-yargs'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:636:15)
at Function.Module._load (internal/modules/cjs/loader.js:562:25)
at Module.require (internal/modules/cjs/loader.js:692:17)
at require (internal/modules/cjs/helpers.js:25:18)
at Object. (/Users/hll/Desktop/gitlab/crm3/hll-crm-web/node_modules/webpack-dev-server/bin/webpack-dev-server.js:56:1)
at Module._compile (internal/modules/cjs/loader.js:778:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:789:10)
at Module.load (internal/modules/cjs/loader.js:653:32)
at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
at Function.Module._load (internal/modules/cjs/loader.js:585:3)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] dev: `cross-env BABEL_ENV=development webpack-dev-server --max_old_space_size=6144 --colors --config config/webpack.dev.config.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/hll/.npm/_logs/2021-08-20T06_58_46_914Z-debug.log
注意这个报错，如果要百度查询，需要搜这个
Error: Cannot find module 'webpack/bin/config-yargs'
而不是搜
dev: `cross-env BABEL_ENV=development webpack-dev-server --max_old_space_size=6144 --colors --config config/webpack.dev.config.js`
下面来分析下原因和解决方法：
原因:
这个就是目前版本的[email protected]不支持 [email protected]
解决:
重装一个webpack-dev-server是3.0版本以上就兼容 :
npm i [email protected] -D
此时, 就可以了... 如果还报错, 参照最后一条!
webpack4.0以上都要安装webpack-cli, 否则报错如下:
Error: Cannot find module 'webpack-cli/bin/config-yargs'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:581:15)
at Function.Module._load (internal/modules/cjs/loader.js:507:25)
at Module.require (internal/modules/cjs/loader.js:637:17)
at require (internal/modules/cjs/helpers.js:22:18)
这时, 需要安装webpack-cli :
npm i webpack-cli -D
这个具体看看链接：https://www.cnblogs.com/zixuan00/p/10974970.html