webpack血泪史(下)--从放弃到成功

上一篇 webpack血泪史(上)–从安装到放弃

上一篇介绍了从淘宝源安装webpack,这种方法安装webpack,只要保证待安装环境是干净的,安装命令准确,基本都可以安装成功。但淘宝源的cnpm不稳定,也不是开发、测试的长久之计,在一次重新编译npm失败后,我决定,安装原生npm,啃下这块硬骨头。
到网上查了一些资料,也问了公司大佬,安装webpack只需要局部安装(本地安装)就好了,全局安装没什么必要,所以,今天记录一下我安装原生npm和webpack踩过的坑。

安装node.js

关于安装node.js,webpack官方文档上写的很清楚,node.js必须是长期支持版本的,即LTS版本
1
所以,我就在node.js官网上下载了10.16.0 LTS版
2
这是一个打好包的安装器,按照提示一路next就好
node.js安装的时候已经把npm安装好了,这时候打开终端,在主目录下执行命令:

node -v
#查看node.js版本
npm -v
#查看npm版本

查看二者版本号:
3

安装webpack-cli

环境准备好了,现在来安装cli
webpack官方文档中说明,使用最新的webpack 4以上版本,需要在本地安装cli
4
在项目目录下(有package.json文件的项目目录)执行命令:

sudo npm install --save-dev webpack-cli

命令执行完毕后截图如下:
5

安装webpack

webpack官网上关于全局安装还是本地安装有这样一段话:

对于大多数项目,我们建议本地安装。这可以使我们在引入破坏式变更(breaking change)的依赖时,更容易分别升级项目。通常,webpack 通过运行一个或多个 npm scripts,会在本地 node_modules 目录中查找安装的 webpack:

所以我们只要本地安装即可,执行命令:

sudo npm install --save-dev webpack

安装完的截图:
6
到此为止,安装一切顺利,你以为这样就完了?No,踩坑之旅即将开始~

测试安装成果

测试安装成果过程中出现了很多意想不到的error,由于error太多,篇幅过长,请见博文:webpack安装成功后的run build填坑之旅

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值