进行前端打包需要使用webpack,下面介绍如和安装webpack和webpack-cli

新版的nodejs已经集成了npm,在使用npm命令前得先安装nodejs,在使用npm安装webpack前可以先安装nrm,nrm的作用是修改npm下载安装镜像源,npm的默认下载源在国外,国内下载缓慢,可以科学上网下载,也可以使用nrm将默认源修改成其他国内源,下载就更快

nrm常见命令

  • nrm -v(查看nrm版本号)
  • nrm ls(列出所有仓库地址)
  • nrm use [name](将npm仓库地址替换)

npm常见命令

  • npm -v (查看npm版本号)
  • npm get registry(获取npm下载仓库地址,可以通过nrm修改)
  • npm install npm -g(windows更新npm,install指的意思是安装,可以简写为i,-g的意思是全局安装,其他方式安装参考)
  • npm install express(安装模块,express换成对应模块名称即可,同第三条,后面可以加-g全局安装)
  • npm uninstall express(卸载模块,express换成对应模块名称即可)
  • npm update express(更新模块,express换成对应模块名称即可)
  • npm list -g(查看所有全局安装的模块,-g替换成对应的其他环境)

替换仓库地址或使用cpnm


方式一(推荐):使用淘宝npm镜像

命令行输入:

npm install -g cnpm --registry=https://registry.npm.taobao.org

安装完成后将有所的npm命令换成cnpm即可,后面我将用cpnm安装webpack


方式二:nrm替换

首先以管理员身份打开cmd

命令行输入下列命令回车全局安装nrm

npm i nrm -g

输入nrm -V(注意是大写的V)查看是否安装成功,如果报[TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received undefined的错误(下图一),请复制下图红框内的路径找到cli.js,在const NRMRC......那一行前面加两条斜杠注释,并在下一行加入代码const NRMRC = path.join(process.env[(process.platform == 'win32') ? 'USERPROFILE' : 'HOME'], '.nrmrc');(下图三),保存后重新输入nrm -V查看版本

命令行输入nrm ls列出所有仓库地址

输入nrm use taobao使用淘宝仓库,输入npm get registry可以看到地址变成淘宝的了

安装webpack和webpack-cli

安装好cpnm后可以使用cpnm安装webpack和webpack-cli,命令行输入cnpm i webpack -g全局安装webapck,命令行输入cnpm i webpack-cli -g全局安装webapck-cli,命令行输入webpack -v查看webpack是否安装成功如图


转载标明出处
注原文链接:https://imold.wang/front-end/jsframe/325.html
仿冒必究


天天摸鱼,将来有一天会成为摸鱼大佬吗