Nodejs安装详细步骤

Love The Way You Lie 2022-03-25 15:16 433阅读 0赞

nodejs作为一个新兴的前端框架；安装步骤包含其他模块的安装内容；

正在挠头的我看到这位老兄的博客：[https://www.cnblogs.com/goldlong/p/8027997.html][https_www.cnblogs.com_goldlong_p_8027997.html]   ；个人觉得分析很仔细，于是自己臭不要脸的“学习”了一下![20190121164016641.png][]![20190121164019389.png][]![20190121164020622.png][]；

下载地址：[https://nodejs.org/en/][https_nodejs.org_en]  进入页面，可以看到一个推荐本版，一个当前最新版本；**大多数情况下建议选择推荐版本**；

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70][]

点击安装之后就一路next就ok了，因为是直接安装，所以环境变量就直接被添加了。

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 1][]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 2][]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 3][]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 4][]

安装完成之后，到安装目录能够查看到该文件结构；

完整包含**模块**、**notejs**程序和**包管理器**

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 5][]

验证环境变量；

打开cmd命令输入命令：echo %path%

如果能看到安装的nodejs的路径，表示path环境变量设置ok

在输入命令：npm -v

如果能看待对应的版本号，安装ok！

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 6][]

这就表示环境变量还没有设置ok；就必须要设置环境变量；

虽然安装完毕，但是我们还有点小问题：

分别输入命令：node -v   和 npm -v 发现npm的版本不是最新的。

![20190121161424657.png][]

**至于为什么版本不是最新的，还没有答案，如果有大神知道，还请告知！**

到目录：C:\\Users\\LiRui\\AppData\\Roaming  查看是否有npm 和npm-cache两目目录；

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 7][]

将这两个文件夹试图copy到nodejs安装目录；在安装目录新建**node\_global** 和 **node\_cache**两个目录

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 3][]

执行命令：

### npm config set prefix "C:\\openSource\\nodejs\\node\_global" ###

### npm config set cache "C:\\openSource\\nodejs\\node\_cache" ###

npm list -global查看目录地址是否已经变化；

![20190121161425506.png][]

配置镜像站：npm config set registry=[http://registry.npm.taobao.org][http_registry.npm.taobao.org]

执行命令：npm config list

查看cache、prefix、registry三个参数配置数据是否正确；

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 8][]

接下来找到配置文件所在：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 9][]

进行编辑可以查看我们刚刚配置的信息；

查看镜像：

![2019012116142371.png][]

测试能否获得vue信息：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 10][]

更新npm：

npm install npm -g

![20190121161426794.png][]

现在npm更新为6.6版本；

npm list -global

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 11][]

注：

之前安装是默认的模块是：C:\\openSource\\nodejs\\node\_modules

现在一顿操作之后就会改变为：C:\\openSource\\nodejs\\node\_global\\node\_modules

如果我们现在直接运行npm install等命令会直接报错；

所以我们需要修改环境变量：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 12][]

重新打开cmd命令行：npm install vue -g

![2019012116142566.png][]

vue.js安装完毕；

这里的npm install 是指安装命令； vue是模块 ， -g是放在全局目录；

然后检查vue的安装位置：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 13][]

这里的vue模块已经安装到了我们配置的新目录里面；

接下来我们测试npm 安装vue-router

执行命令：npm install vue-router -g

![2019012116142563.png][]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 14][]

测试安装vue-cli  (vue脚手架)

执行命令：npm install vue-cli -g

![20190121161427271.png][]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 15][]

现在发现输入：vue ；提示不是内部命令

![2019012116142561.png][]

这是因为C:\\openSource\\nodejs\\node\_global目录不再环境变量中：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 16][]

配置环境变量后，重新打开命令行执行命令：vue -V    **注：-V是大写的V**

![2019012116142561.png][]

ok正常了；

### **注意，vue-cli工具是内置了模板包括 webpack 和 webpack-simple,前者是比较复杂专业的项目，** ###

### **他的配置并不全放在根目录下的 webpack.config.js 中。** ###

切换到cmd根目录：vue init webpack vue01

安装途中有时会遇到突然不动了，敲下回车就可以了；

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 17][]

初始化，安装依赖

![20190121161425844.png][]

执行命令：npm run dev

![20190121161425276.png][]

访问网址：[http://localhost:8080][http_localhost_8080]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 18][]

生成静态文件：npm run build

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 19][]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 20][]

这里还偷了大神一张图解释结构：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 21][]

总结：

过程有些复杂，做完感觉还是没有什么难点，重要在于理解各个模块的功能；

环境变量哪里在更改了配置之后，需要记得一定要修改环境变量；

[https_www.cnblogs.com_goldlong_p_8027997.html]: https://www.cnblogs.com/goldlong/p/8027997.html
[20190121164016641.png]: https://img-blog.csdnimg.cn/20190121164016641.png
[20190121164019389.png]: https://img-blog.csdnimg.cn/20190121164019389.png
[20190121164020622.png]: /images/20220325/33cfd75c9c0149c9b60ce1ea05c8c849.png
[https_nodejs.org_en]: https://nodejs.org/en/
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70]: /images/20220325/ee00f4b0dbd9477db5ad998bd98197e2.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 1]: /images/20220325/cf92725e87ac44faba3eba4971694efc.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 2]: /images/20220325/45aecc35e7be40698b18595c14d68b38.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 3]: /images/20220325/d5f83eafe93c4d878a7cea3f985f3f7c.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 4]: /images/20220325/947ba1d264ba42919b476202fe83f20d.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 5]: /images/20220325/408a419c3f814842b9463397711de2fc.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 6]: /images/20220325/65abbd89a3ce46b7b580fbaacc64fb1f.png
[20190121161424657.png]: /images/20220325/1ebea95cbb004a5681b6d27ae8d24392.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 7]: /images/20220325/d657ff211db14e0aa70e397eed463bf6.png
[20190121161425506.png]: /images/20220325/236c26b1ab5c476cb33e5069f664c7fc.png
[http_registry.npm.taobao.org]: http://registry.npm.taobao.org/
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 8]: /images/20220325/de9f5481ac144ca786890fb8b8afaea5.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 9]: /images/20220325/6480cbb956e243a9bc85f6e85196d50e.png
[2019012116142371.png]: /images/20220325/a82a4c4688b14da1830ebdbb47a2f2c9.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 10]: /images/20220325/3504b6e4c74a449da5f8855a8aa38363.png
[20190121161426794.png]: /images/20220325/a6c31d32034e457ca95b632aa56d0451.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 11]: /images/20220325/6913f38e8d7243db844c84af99ddf093.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 12]: /images/20220325/9161c1029f294bcc860c1ff9b766f871.png
[2019012116142566.png]: /images/20220325/f89151cd88e64a28ac39c7806c01aa15.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 13]: /images/20220325/34b74ab56b014ad6b55bcfc3d3f990b2.png
[2019012116142563.png]: /images/20220325/4a81774febb84d00bdb9808f01520871.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 14]: /images/20220325/7620a9a61aa647e59f9e3e99238a0fac.png
[20190121161427271.png]: /images/20220325/4af8024eb001487aadd2ca31eb8ae741.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 15]: /images/20220325/085271ed4fe949b09b11d708db514555.png
[2019012116142561.png]: /images/20220325/e7f47dcbdd93464fbedb4fdcbd088882.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 16]: /images/20220325/de20c41153594708b68be2ab98454323.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 17]: /images/20220325/5ee7df94ebfb43af834192b23b00f72a.png
[20190121161425844.png]: /images/20220325/fbd9262867794d4681a7952f9bbb20e3.png
[20190121161425276.png]: /images/20220325/9a82b9ee241643bba10571d34da3cd4c.png
[http_localhost_8080]: http://localhost:8080/
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 18]: /images/20220325/100a8565d87449bb90bc58bb0cbfcc72.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 19]: /images/20220325/d32aeacb2d604869afe2255af2637645.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 20]: /images/20220325/f43b4bd7c1de407ebf868290e14be117.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2tlZW5zdHlsZQ_size_16_color_FFFFFF_t_70 21]: /images/20220325/2c758044dd47483faf9260cc1a24de3c.png