npm包管理器干货
- 为了方便携带源码,可以在安装依赖时--save或--save-dev,把依赖记录在package.json中,就可以把node_module文件夹删除,在需要的时候npm i把你安装过的依赖自动下载回来
一、package.json和package-lock.json
1、package.json
- 主要用来定义项目中需要依赖的包
2、package-lock.json
- 在 npm install时候生成一份文件,用以记录当前状态下实际安装的各个npm package的具体来源和版本号。
- 每次执行完npm install之后会对应生成package-lock文件,该文件记录了上一次安装的具体的版本号,相当于是提供了一个参考,在出现版本兼容性问题的时候,就可以参考这个文件来修改版本号即可。
二、npm install的区别
- 下面以vue-router为例
1、npm install vue-router
- 会安装在node_modules目录中,不会修改package.json文件。之后把node_modules文件夹删除或者项目中没有node_modules,运行npm install时不会自动安装,因为package.json文件没有记录。
2、npm install vue-router --save(生产环境)
(1)会把vue-router包安装到node_modules目录中
(2)会在package.json的dependencies属性下添加vue-router
(3)之后把node_modules文件夹删除或者项目中没有node_modules,之后运行npm install命令时,会自动安装vue-router到node_modules目录中
(4)之后运行npm install –production或者注明NODE_ENV变量值为production时,会自动安装vue-router到node_modules目录中
3、npm install vue-router --save-dev(开发环境)
(1)会把vue-router包安装到node_modules目录中
(2)会在package.json的devDependencies属性下添加vue-router
(3)之后把node_modules文件夹删除或者项目中没有node_modules,之后运行npm install命令时,会自动安装vue-router到node_modules目录中
(4)之后运行npm install –production或者注明NODE_ENV变量值为production时,不会自动安装vue-router到node_modules目录中
4、总结
(1)发布到线上的叫生产环境,在本地开发的时候叫开发环境,--save就是会打包到线上去并且在线上环境能用到的,比如你npm install 一个vue-router,这个在线上环境也是能用到的依赖,所以你要--save
(2)比如vue-loader这个组件只需要在开发的时候编译就好,线上并不需用的到,所以就放在开发的--save-dev里就好
(3)--save安装的时候会在package.json文件中的dependencies属性添加模块,这个属性就是发布时依赖的包
(4)--save-dev安装的时候会在package.json文件中的devDependencies属性添加模块,这个属性就是开发时依赖的包
5、举个栗子
-
如果你想把ES6编译成ES5,就用到了babel,那么 就是devDependencies,发布的时候不需要再用babel了,因为打包后就是已经编译出来的ES5代码。
如果用了VUE,由于发布之后还是依赖VUE,正式上线,投入使用的时候还是要用到VUE,所以是dependencies。