webpack devDependencies、dependencies的区别

骑猪看日落 2021-09-18 02:36 446阅读 0赞

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM1NDMwMDAw_size_16_color_FFFFFF_t_70][]

安装包命令  
npm  i(install)  xxx:直接安装在当前文件夹下的node\_modules下，但不写入package.json  
npm  i(install)  xxx  --save(-S):直接安装在当前文件夹下的node\_modules下，写入package.json的dependencies  
npm  i(install)  xxx  --save-dev(-D):直接安装在当前文件夹下的node\_modules下，写入package.json的devDependencies  
npm  i(install)  xxx  -g:安装在全局npm包管理器下    
npm uninstall  xxx   删除xxx模块；  
npm uninstall  -g  xxx  删除全局模块xxx；

通过NODE\_ENV=developement或NODE\_ENV=production指定开发还是生产环境。

devDependencies是在开发环境下依赖的模块，生产环境不会被打入包内，比如babel和一些loader是作为编译使用的，编译完成后devDependencies里面的包不会被引入。

dependencies下的包是必须要引入的，比如说vue、axios等。npm run bulid时，将dependencies里的所有包，打包成一个vendor.js文件，因为这个文件都是三方库，代码几乎不太会改变，这样，这部分代码就能很好的被浏览器缓存利用了；

若文件中import  引入 devDependencies 中插件   依然会把当前引入的插件打包到文件中，不引入，则不打包。  
而 dependencies 中的插件不管你引不引入都会打包到文件中去。

开发环境依赖安装到dependencies，本地和生产环境都没问题，就是文件会大一点而已。  
生产环境依赖安装到devDependencies，本地没啥问题，生产环境会因为缺少依赖而无法正常运行。

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM1NDMwMDAw_size_16_color_FFFFFF_t_70]: /images/20210812/220c2816b99f4d25a00e62beaabea939.png