1.npm仓库与依赖的概念
npm是一个包管理器,通过站点上的仓库,实现上传、分发、下载包的功能
- 由于站点在国外,我们可以设置连接npm的国内淘宝镜像站点
npm config set registry https://registry.npm.taobao.org
npm install loadash --save
/npm install loadash -s
--save
是为了将下载下来的包记录在package.json中的dependencies字段中,后续项目迁移后,只需要运行npm install
,就可以通过读取该字段内的值,重新将这些包下载下来(npm5后–save已经作为默认参数,无需手动添加)npm install loadash --save-dev
/npm install loadash -d
-d
指定当前依赖的安装环境为开发环境,会把下载下来的包记录在package.json中的devDependencies字段中- package.json中的dependencies和devDependencies的区别
dependencies是生成环境下的依赖,
devDependencies是开发环境下的依赖
当运行npm install
时,依赖包都会被下载到nodemodules文件夹中
但是
- 当运行
npm install --only=prod
时,则只会安装dependencies字段记录中的依赖包 - 当运行
npm install --only=dev
时,则只会安装devDependencies字段记录中的依赖包
综上,所以:
- 所有与功能相关的依赖都应该放在dependencies字段中,
- 而devDependencies字段中往往记录譬如构建工具、质量检测工具如eslint这种只有本地开发才使用的包
2.npm“语义化版本”
语义化版本设计的初衷,是允许依赖的版本是动态的,从而可以使我们npm install
下载依赖包时能获取一定范围内的最新版本,如:^version
: 对应中版本和小版本,即 ^1.0.1 -> 1.x.x ,指定版本号为1.x.x中的最新版本~version
: 对应小版本,即 ~1.0.1 -> 1.0.x,指定版本号为1.0.x中的最新版本version
: 锁定特定版本,即将大版本号、中版本号和小版本号都锁定
例如:
{
"name": "demo",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"dependencies": {
"loadash": "^1.0.0", // 指定install版本号为1.x.x中的loadash的最新版本
"jquery": "~3.4.1", // 指定install版本号为3.4.x中的jquery的最新版本
}
}
3.使用npm自定义工程脚本
即如何设置package.json中的scripts字段使我们的工作更加自动化
scripts字段是npm提供的一个脚本命令功能
如
在scripts字段中设置
-
"dev": "webpack-dev-server"
,自定义dev命令,当运行 npm run dev 时,原地启动webpack开发服务器 -
"build": "eslint ./src && webpack"
, 自定义build命令,当运行 npm run build 时,对代码格式做校验,校验后打包
4.npm install
的过程
- 寻找包版本信息文件(package.json),依照它来进行下载安装
- 查package.json中的依赖,并检查项目中其他的版本信息文件
- 如果发现了新包,就更新版本信息文件
如果我们发现项目中的某个包和我们预想中不一致时,首先应该去看版本信息文件这个包的来源和版本,因为在安装过程中,版本信息文件的优先级是最高的
下载指定版本的包,比如使用npm下载jquery依赖
npm install jquery@2.0.0 --save
5.使用使用npm初始化项目
首先校验是否安装node和npm(当node安装时会自动包含npm的安装)
node -v
npm -v
使用npm初始化项目
npm init
创建完毕后vscode打开工程
code .
项目生成package.json文件
// json格式文件
{
"name": "demo", // 包名称
"version": "1.0.0", // 版本号
"description": "",
"main": "index.js", // 包执行的入口
"scripts": { // 自定义脚本
"test": "echo \"Error: no test specified\" && exit 1",
"dev": "webpack-dev-server", // 自定义dev命令,当运行 npm run dev 时,原地启动webpack开发服务器
"build": "eslint ./src && webpack" // 自定义build命令,当运行 npm run build 时,对代码格式做校验,校验后打包
},
// 通过自定义脚本可以实现开发和构建中的自定义命令,设置后通过 npm run dev(或者build)运行自定义的命令
"author": "",
"license": "ISC",
"dependencies": { // 记录项目依赖的包及其版本号
"loadash": "^1.0.0",
"jquery": "3.4.1"
}
}
6.对于npm出现问题后的暴力解决方案
先删除下载的依赖后再重装
rm -rf node_modules && npm install
package-lock.json的作用