Vue环境搭建及node安装过程整理

    科技2022-07-13  141

    一、nodejs的安装 Node.js安装包及源码下载地址为:https://nodejs.org/en/download/。

    我们可以根据不同平台系统选择你需要的Node.js安装包。Node.js 历史版本下载地址:https://nodejs.org/dist/

    这里演示的是Window64位安装Node.js,下面演示的是采用安装包的方式来安装。

    1、Windows 安装包(.msi) Node.js默认安装目录为 “C:\Program Files\nodejs” , 你可以修改目录,并点击 next(下一步):

    :点击 Install(安装) 开始安装Node.js。你也可以点击 Back(返回)来修改先前的配置。 然后并点击 next(下一步):

    安装完之后启动cmd依次执行以下两条命令检测是否安装成功,结果如下:

    二、node.js的环境变量的新建。 //我安装的路径是 D:\soft\nodejs

    其实安装完node,就自动在path里增加环境变量,但是为了以后的本地部署项目,我们需要找到node.js的安装根目录,在当中新建“node_global”和"node_cache"两个文件夹。

    1、 启动cmd依次执行以下两条命令

    npm config set prefix " D:\soft\nodejs\node_global"   npm config set cache " D:\soft\nodejs\node_cache"

    2、 设置环境变量

    说明:设置环境变量可以使得住任意目录下都可以使用cnpm、vue等命令,而不需要输入全路径

    1.鼠标右键"此电脑",选择“属性”菜单,在弹出的“系统”对话框中左侧选择“高级系统设置”,弹出“系统属性”对话框。

    2.点击环境变量弹出下列对话框:

    3.新增系统变量NODE_PATH:把变量值设置成“D:\soft\nodejs\node_global\node_modules” (这样就可以把后面全局安装的装到global里并且可以直接用命令使用。)

    4. 修改用户变量PATH:选中PATH,点击编辑,把“D:\soft\nodejs\node_global;”加到前面

    三、安装淘宝的npm镜像

    输入npm install -g cnpm –registry=https://registry.npm.taobao.org,即可安装npm镜像,以后再用到npm的地方直接用cnpm来代替就好了。

    这个其实看个人爱好吧,因为npm在国内下载速度是很慢,所以就用npm下载安装cnpm可以更快的下载后面的依赖等等。

    四、安装全局vue-cli脚手架、webpack

    命令输入

    cnpm install vue –g //全局安装vue

    cnpm install -g vue-cli //全局安装vue-cli

    cnpm install -g webpack //全局安装webpack

    cnpm install -g webpack-dev-server //安装webpack的本地webserver

    安装完成后,vue-cli脚手架其实就已经把vue也装掉了,所以只需输入vue -V 和 webpack -v 等等就可以查看安装成功与否。

    Processed: 0.013, SQL: 8