Webpack的全局安装

た入场券 2023-05-30 03:48 22阅读 0赞

1.window+R键，输入cmd打开命令行工具，输入 `mkdir XXXX`（XX：文件夹名）；

2.cd XXX 进入刚刚创建好的文件夹里，输入`cnpm install -g webpack` （安装了淘宝镜像的小伙伴可以直接使用cnpm，没有安装的使用npm）cnpm和npm的区别这里就不多说了，不懂的小伙伴可以百度

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RhcG9uaQ_size_16_color_FFFFFF_t_70]  
3.安装完成后直接输入`webpack -v` 仍会叫你初始化东西，但还是会报错，  
网上找答案：  
![在这里插入图片描述][20191107102529789.png]  
原来是在webpack 3中，webpack本身和它的CLI以前都是在同一个包中，所以只安装webpack就可以了，但在第4版中，他们已经将两者分开来更好地管理它们，所以你安装了webpack后还要尝试全局安装webpack-cli，而你指定安装3.x版本的webpack则不用分开安装，  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RhcG9uaQ_size_16_color_FFFFFF_t_70 1]  
4.还要安装全局安装’webpack-cli’，指令`cnpm install webpack-cli -g`  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RhcG9uaQ_size_16_color_FFFFFF_t_70 2]  
5.再输入`webpack -v` 就能看到版本了  
![在这里插入图片描述][20191107102407661.png]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RhcG9uaQ_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20191107102134266.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RhcG9uaQ==,size_16,color_FFFFFF,t_70
[20191107102529789.png]: https://img-blog.csdnimg.cn/20191107102529789.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RhcG9uaQ_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/2019110710224088.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RhcG9uaQ==,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RhcG9uaQ_size_16_color_FFFFFF_t_70 2]: https://img-blog.csdnimg.cn/20191107102340450.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RhcG9uaQ==,size_16,color_FFFFFF,t_70
[20191107102407661.png]: https://img-blog.csdnimg.cn/20191107102407661.png