• NodeJS的安装与配置


    1、nodejs的安装

    ①、nodejs的简介

    Node.js 是 Javascript 的运行环境(Runtime),发布于2009年5月,它是能让 JavaScript 程序运行在服务端的一个开发平台,类似于后端的服务器,让项目运行在服务器上,然后通过浏览器访问(例如:localhost:8080)。它让 JavaScript 成为与Java,PHP、Python等服务端语言平起平坐的脚本语言。

    ②、npm 的简介

    npm 是 node.js 的包管理器,npm全称为:node package manager,它已经整合在node.js中,我们可以理解它为后端的Maven工具,它能够帮助前端进行项目的构建和管理。

    工具 作用 仓库 镜像
    npm 管理前端系统依赖 远程仓库(中央仓库) 淘宝镜像
    maven 管理java后端依赖 远程仓库(中央仓库) 阿里云镜像

    Vue 工程需要建立在node.js 的基础上。如果要使用Vue,那么安装NodeJS是基础,NodeJS的安装非常的简,以下是NodeJS的安装步骤教:

    node.js官方网址:https://nodejs.org/zh-cn/ 这里选择下载稳定版本,下载哪个版本完全取决于自己。

    image

    1、双击刚刚下载的安装包。

    image

    2、点击Next,开始安装。

    image

    3、勾选协议,然后点击Next

    image

    4、更改nodejs的安装路径,这里直接将C:Program Files odejs改为D:NodeJS,然后点击Next

    image

    5、自定义设置这里不用进行选择,默认就好,继续点击Next

    image

    6、不勾选安装工具,继续点击Next。

    image

    7、点击Install开始进行安装。

    image

    8、等待安装完成。

    image

    9、安装完成,点击Finish关闭,至此Nodejs就安装完毕了。

    image

    10、最后验证 nodejs 和 npm 包管理器是否安装成功,打开cmd控制台,输入cmd,然后依次输入如下两个命令:

    • node -v:查看nodejs的版本号。
    • npm -v:查看npm的版本号。

    image

    出现如上提示则表明安装成功了。

    2、nodejs的相关配置

    其实只要上面Nodejs的安装完成就可以使用了,但是本人对于软件的安装有强迫症,就是与系统无关的软件绝对不会安装在C盘,而npm安装的全局模块和缓存默认会放在C盘,所以需要修改这两个文件的存储路径,操作如下:

    • 默认模块安装路径:C:Users{你的用户名}AppDataRoaming pm
    • 默认缓存路径均:C:Users{你的用户名}AppDataLocal pm-cache

    2.1、修改模块安装路径和缓存路径

    ①、首先打开 cmd 控制台,使用如下两个命令来查看当前使用的路径。

    • npm config get prefix:查看npm下载的模块存储路径
    • npm config get cache:查看缓存存储路径

    image

    ②、然后找到你的 node.js 安装路径,新建一个文件夹 node_cache。

    image

    ③、接着在 cmd 控制台中输⼊如下两个命令:

    npm config set prefix "D:NodeJS"
    

    作用:设置模块存放根路径(相当于Maven的本地仓库),从远程仓库下载的模块都会存放在该路径下。这里设置为NodeJS的安装路径,因为在安装node.js时会自动给我们创建一个node_modules文件夹(默认存放npm),而我们在第一次使用npm命令下载模块的时候,也会在指定的目录创建一个node_modules文件夹用于存储模块,我们使其重合在一起,所以说我们的模块实际是存放在D:NodeJS ode_modules下的。

    npm config set cache "D:NodeJS
    ode_cache"
    

    作用:设置缓存存放路径,就是你刚刚创建的node_cache文件,将缓存存放至该文件。

    image

    ④、最后继续使用npm config get prefixnpm config get cache命令查看是否配置成功。

    image

    可以发现配置成功了。


    2.2、配置系统环境变量

    按照上面的这种方式不需要配置环境变量

    因为上面实际的模块存放路径是在D:Nodejs ode_modules下,而模块的命令存放在D:Nodejs下。当我们在安装Nodejs时,系统会默认给我们配置了一个环境变量,变量值为:D:Nodejs,而我们的命令恰好在这个目录下,所以不需要再配置系统环境变量了。

    注:配置环境变量的目的是可以全局访问到命令。

    右击此电脑-->点击属性-->高级系统设置-->环境变量-->编辑系统变量-->找到Path双击

    image

    3、npm设置国内镜像

    在上面也介绍了npm和maven一样是有中央仓库的,众所周知,国内直接使用 npm 的官方镜像是非常慢的,所以这里推荐使用淘宝 npm 镜像。

    npm config set registry https://registry.npm.taobao.org
    

    设置完成之后使用下面命令查看:

    npm config get registry
    

    image

    输入如下命令显示所有配置信息:

    npm config list
    

    image

    注意:上面配置的配置信息都会保存在本地,存放路径:C:Users{用户名}.npmrc

    如果要卸载NodeJS则必须删除该文件,否则下次模块和缓存的路径还是这个。

    image

    image

    4、npm安装vue.js和vue脚手架

    4.1、npm安装vue.js

    npm install -g vue   ##下载vue.js
    npm uninstall -g vue   ##卸载vue.js
    

    注意:一定要加上-g,这是全局安装的意思,如果不加是局部安装,会安装在cmd控制台当前运行的目录下

    image

    image

    4.2、npm安装vue脚手架(vue-cli)

    vue-cli:用于生成Vue工程模板。(它可以帮你快速开始一个vue的项目,也就是给你一套vue的结构,包含基础的依赖库)。vue-cli工具还内置了模板包括 webpack 和 webpack-simple

    ①、下载vue-cli

    npm install -g vue-cli  ##安装2.x版本的脚手架
    npm install -g @vue/cli  ##安装3.x版本的脚手架
    

    注意:2.x和3.x版本的脚手架只能安装安装一个,否则会冲突。

    ②、卸载vue-cli

    npm uninstall -g vue-cli  ##卸载2.x版本的脚手架
    npm uninstall -g @vue/cli  ##卸载3.x版本的脚手架
    

    ③、更新脚手架

    npm update -g @vue/cli
    

    image

    image

    ④、验证是否安装成功

    vue -V
    

    注:后面的V是大写的

    image

    作者: 唐浩荣
    本文版权归作者和博客园共有,欢迎转载,但是转载需在博客的合适位置给出原文链接,否则保留追究法律责任的权利。
  • 相关阅读:
    【Foreign】数数 [打表][DP]
    【Foreign】猜测 [费用流]
    【Foreign】最大割 [线性基]
    【Foreign】开锁 [概率DP]
    【Foreign】染色 [LCT][线段树]
    【Foreign】阅读 [线段树][DP]
    【Foreign】字符串匹配 [KMP]
    【Foreign】冒泡排序 [暴力]
    【BZOJ1976】能量魔方 [最小割]
    【Foreign】树 [prufer编码][DP]
  • 原文地址:https://www.cnblogs.com/tanghaorong/p/14652357.html
Copyright © 2020-2023  润新知