npm安装-具体教程
npm安装教程第一章 Vue学习入门之 Node.js 的使用
前言
随着期间的不断发展，前端学习这门技术也越来越重要，许多人都开启了学习前端学习，本文就介绍了前端学习的根本内容——npm安装。
一、npm是什么？
npm 是 NodeJS 下的包管理器，vue-cli脚手架模板就是基于 node 下的 npm 来完成安装的。
相关介绍~
webpack: 它的重要用途是通过CommonJS的语法把所有浏览器端须要发布的静态资源做相应的预备，比如资源的合并和打包。
vue-cli：官方提供的一个脚手架，用于快速生成一个 vue 的项目模板。
二、安装、设置环境变量
1.下载并安装NodeJS
windows下的NodeJS安装是比较方便的（v0.6.0版本之后，支持windows native），只须要直接访问官网（https://nodejs.cn/download/），这里我们可以选择 Windows 安装包 (.msi)-64位 进行安装。
https://i-blog.csdnimg.cn/blog_migrate/0afa6cbd27079bf0b44ab729615287d8.png
大概直接登岸官网 http://nodejs.org/
https://i-blog.csdnimg.cn/blog_migrate/227c75795e079f27d18587cef8f87a89.png
[*]安装过程根本一起直接“NEXT”就可以了，直到Finished。
https://i-blog.csdnimg.cn/blog_migrate/f62898ac61f70a2063ef833b63e3a8cb.png
https://i-blog.csdnimg.cn/blog_migrate/fa7182c8e59e5f96c21baaa51266d504.png
https://i-blog.csdnimg.cn/blog_migrate/6ecfd7fa631bfc9080f20cf167e4fe33.png
windows下，安装msi文件在过程中会直接添加path的系统变量，变量值是你的安装路径，例如“D:\RunSoftware\nodejs”
https://i-blog.csdnimg.cn/blog_migrate/cb99f3b9dc74ebf6669436f78f4cc225.png
https://i-blog.csdnimg.cn/blog_migrate/0986770516e0afafa4e21cf5e51401ad.png
[*]确认 nodejs 安装成功：
快捷键 win+R —> 输入 cmd下令行，进入 dos 窗口：输入 node -v， 查察是否能够精确打印出版本号即可！
https://i-blog.csdnimg.cn/blog_migrate/7d7f4c997ac129275420a92d22082a6b.png
node自带 npm，输入 npm -v，查察是否能够精确打印出版本号即可！
https://i-blog.csdnimg.cn/blog_migrate/44d8c88c5dcfd0f18548c988b30fa5ad.png
2.npm设置
npm作为一个NodeJS的模块管理，我们可以先设置npm的全局模块的存放路径以及cache的路径。
（1）创建2个目次 node_cache 和 node_global 。
假如想将这两个文件夹放在NodeJS的主目次下，便在NodeJs下创建"node_global"及"node_cache"两个文件夹。如下：
https://i-blog.csdnimg.cn/blog_migrate/f4796c3d04ff4718e46a0ca1570fe864.png
（2）进行设置
npm config set prefix "D:\RunSoftware\nodejs\node_global"
npm config set cache "D:\RunSoftware\nodejs\node_cache"
假如不进行这一步设置，npm的全局安装包，将不会在node安装文件夹里。
假如这个步调出现错误，如：operation not permitted, mkdir ‘D:\RunSoftware\nodejs’，请使用管理员身份打开cmd下令行。
这里我们可以看到：
https://i-blog.csdnimg.cn/blog_migrate/354cb8b784e19b767192ed2d81e6a26c.png
（3）设置 环境变量
进入环境变量对话框，在系统变量下新建 “NODE_PATH”，输入”D:\RunSoftware\nodejs\node_global\node_modules“。
https://i-blog.csdnimg.cn/blog_migrate/6c9dfd02c83c0089950a1ad354e70536.png
https://i-blog.csdnimg.cn/blog_migrate/b57fb6b987d2809c753bf09e7b6cd865.png
由于改变了module的默认地点，所以上面的用户变量都要跟着改变一下（用户变量"PATH"修改为“D:\RunSoftware\nodejs\node_global\”），否则使用 module 的时候会导致输入下令出现 “xxx不是内部或外部下令，也不是可运行的程序或批处置惩罚文件”这个错误。
https://i-blog.csdnimg.cn/blog_migrate/b84da8c73a68185b252af96c176740cd.png
（4）安装 Node.js 淘宝镜像加快器（cnpm）。这样子的话，下载会快许多~
[*] 设置镜像站：npm config set registry=https://registry.npm.taobao.org
https://i-blog.csdnimg.cn/blog_migrate/92d3f1ec3b00695ed9f8795830c13ca3.png
https://i-blog.csdnimg.cn/blog_migrate/5a6db5641931b69e5a90034b0696ff71.png
[*] 检查一下镜像站是否可以：npm config get registry
https://i-blog.csdnimg.cn/blog_migrate/5675db2bd983c8ded0295e07c3a8f895.png
[*] 接下来，输入下令：npm install -g cnpm --registry=https://registry.npm.taobao.org
https://i-blog.csdnimg.cn/blog_migrate/2312fc1de4a64cb1fd64702452c88aaf.png
大概输入如下下令：
# -g 就是全局安装
npm install cnpm -g
# 或使用如下语句解决 npm 速度慢的问题
npm install --registry=https://registry.npm.taobao.org
[*]添加系统变量path的内容：
由于 cnpm 会被安装到 D:\RunSoftware\nodejs\node_global 下，而系统变量path并未包含该路径。所以我们在系统变量path下添加该路径后，便可正常使用 cnpm 。
https://i-blog.csdnimg.cn/blog_migrate/dba0b2abfaaabf16f7aa666be90a556d.png
[*]然后，输入下令：cnpm -v，查察效果。
https://i-blog.csdnimg.cn/blog_migrate/c224be6bf4ab9889c96f9b732df2e31a.png
安装过程可能会有点慢，耐烦等待！虽然安装了 cnpm，但是尽量少用！
安装的位置，如下：
https://i-blog.csdnimg.cn/blog_migrate/fd3215fcbaed4197aad7b95f2f0b8bca.png
至此，我们的 npm 安装就成功竣事了！以上就是本日要讲的内容，本文仅仅简单介绍了npm 的安装，还有更多知识等待我们的探索！
现在，我们就可以开启 vue-cli 学习之旅啦~小伙伴们可以看我的另一篇文章 vue-cli具体教程，盼望对你们所有帮助哦~
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。
页:
[1]