一.知识回顾
【0.三高商城系统的专题专栏都帮你整理好了,请点击这里!】【1-系统架构演进过程】【2-微服务系统架构需求】【3-高性能、高并发、高可用的三高商城系统项目介绍】【4-Linux云服务器上安装Docker】【5-Docker安装部署MySQL和Redis服务】【6-Git安装与配置过程、Gitee码云上创建项目、IDEA关联克隆的项目】【7-创建商城系统的子模块并将修改后的信息使用Git提交到Gitee上】【8-数据库表结构的创建&后台管理系统的搭建】
二.Node下载安装与配置
2.1 Node下载
因为前端的项目用到的技术:Vue+ElementUI,所以我们需要使用Node。
大致步骤:
- 去官网下载对应的版本
- 无脑安装
- 配置环境变量
- 验证是否成功
好了,这里我就我一个步骤一个步骤介绍了,学到这里,相信大家肯定没有问题了,当然,需要的可以直接点击下面这篇博客,node安装博客
2.2 Node环境变量的配置
配置环境变量
cmd命令窗口使用node -v命令和npm -v命令查看对应的版本信息
2.3 修改npm默认缓存数据的位置
注意:需要我们进行下一步的配置,否则,随着你测试开发各种不同的项目,安装的模块越来越多,这个文件夹的体积就会越来越大,直到占满你的C盘。所以我们要修改npm的配置。
- 在nodejs文件夹下,创建两个为文件夹: node_global;node_cache
这是用来放安装过程的缓存文件以及最终的模块配置位置 - 使用下面命令将npm的全局模块目录和缓存目录配置到我们刚才创建的那两个目录
npm config set prefix “node_global路径位置”
npm config set cache “node_cache路径位置”
- 高级系统设置——环境变量
新增系统变量:
变量名填:NODE_PATH
变量值填:D:\node\node_modules
修改完成后测试:
输入命令:node 回车——再输入 require(‘cluster’)
出现下图表示成功。
三.VScode的安装
前端我们就选用Vscode,当然有很多选择,大家选择自己喜欢的就好,不做强制要求。
3.1 VSCode下载
官网下载对应的版本 然后双击运行,无脑安装。
3.2 VsCode所用的前端插件下载
所需要的软件,也不是全部都需要,以后会需要,如果你是前端开发工程师,那么这些肯定都是必须的。
操作步骤
四.Vue前端项目的部署
Vue项目的开始与安装:https://github.com/renrenio/renren-fast-vue/wiki/Getting-started
设置代理镜像
npm install -g cnpm --registry=https://registry.npm.taobao.org
初始化
cnpm install
安装中如果出现了sass错误提示
那么通过
cnpm install --save node-sass
然后通过
npm run dev
启动成功
访问的页面