一.安装node.js及环境配置
1.Nodejs下载及安装
- 下载地址:下载 | Node.js
- 根据我的系统及位数,我选择windows64位.msi格式安装包(如图),如果想下载其他版本可以选择下方的以往版本选择性下载;
![](https://i-blog.csdnimg.cn/blog_migrate/4a1f5ea389ba2edf900258246d3a5670.png)
- 安装过程一路Next,看个人需不需要设置安装路径等;
- 配置环境变量,此电脑-属性-高级系统设置-环境变量-系统变量-path-编辑,添加新装的node地址:
![](https://i-blog.csdnimg.cn/blog_migrate/91955b6717101c80347dd632891e398e.png)
- 安装及环境配置后验证,任意路径cmd输入以下命令出现相应版本号:
node -v #查看node版本
npm -v #查看npm版本
![](https://i-blog.csdnimg.cn/blog_migrate/3788952c170204da8cb0eada62792b13.png)
2.Npm镜像配置
- 后端过来的伙伴可以理解为maven镜像修改,尤其是在公司内网,连不到外网镜像必须使用公司自己的镜像,如下为修改为公司自己的镜像仓(http://repos.xxxxxxxx.com/repository/api/npm/npm-group/);
- 任意路径cmd输入:npm config set registry http://repos.xxxxxxxx.com/repository/api/npm/npm-group/
3.常用模块安装
- 安装最常用的express模块:npm install express -g
- 全局安装vue:任意路径cmd:npm install vue-cli -g 安装vue,成功后输入vue会输出相关信息。
4.Vue项目启动
- npm项目依赖组件安装:项目根目录下运行 npm install,会根据前端项目的依赖关系(package.json)下载好相关的组件,存在项目目录的node_modules文件夹下;
- npm编译:项目的根目录运行 npm run build,会对根目录下的package.json对build命令的定义进行编译,一般"build" = "webpack -p"。
- 以上步骤成功完成后,前端项目就顺利启动啦!