ssm+vue前后端分离项目之前端项目初始化(笔记)

初始化步骤:

1. 配置前端环境:下载并安装node,官网就有

nodejs对于vuejs的作用不言而喻,想要使用vuejs就必须配置nodejs环境。用vue—cli构建的项目中是以nodejs为基础的,而nodejs为前端工程化提供了必要的条件。

2. 安装vue脚手架

在配置好nodejs环境后,即可安装。
**~~关于旧版本**

Vue CLI 的包名称由 vue-cli 改成了 @vue/cli。 如果你已经全局安装了旧版本的 vue-cli (1.x 或 2.x),你需要先通过 npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸载它。
mention:
Vue CLI 需要 Node.js 8.9 或更高版本 (推荐 8.11.0+)。可以在命令控制板上输入node -v,查看nodejs版本是否符合要求。

输入npm install -g @vue/cli 即可安装
(若想使用可视化仪表盘创建项目,则可以在满足vue-cli版本大于3时,在命令控制板中使用vue ui命令即可跳转)

3. 利用vue-cli创建项目

1.打开仪表盘,点击新建,选择路径后即可创建(项目命名不可含中文),初始化git项,需要选择,建议为init project
2.预设面板:手动配置面板
3.功能面板:babel、router、linter/formatter、使用配置文件(打开视作下载)
4.配置面板:pick a linter/formatter:ESlint+standard config lint on save选择打开

4. 配置vue路由

创建时已经配置

5. 配置element-ui组件库

1.创建后,在仪表盘左侧的菜单区域,选择插件,安装插件vue-cli-plugin-element
2.配置插件:将导入方式由fully import改为import on demand

6. 配置axios库

1.在仪表盘左侧的菜单区域,选择依赖,安装运行依赖axios

7. 初始化git远程仓库

1.首先需要注册一个gitee账户,使用邮箱注册。
2.申请ssh公钥
3.在此之前需要先下载Git,设置环境
4.打开cmd,使用 `ssh-keygen -t rsa -C “[email protected]” 命令,其中引号内为账号邮箱
在这里插入图片描述
5.成功后,会在user文件夹内生成.ssh文件,用记事本打开
在这里插入图片描述
将生成的SSH公钥内容粘贴至在这里插入图片描述
6.添加后,在终端(Terminal)中输入

ssh -T [email protected]
首次使用需要确认并添加主机到本机SSH可信列表。若返回 Hi XXX! You’ve successfully authenticated, but Gitee.com does not provide shell access. 内容,则证明添加成功。
在这里插入图片描述
出现类似界面,successfully,就说明成功了。接着就可以对仓库操作了。

8. 将本地项目托管到GitHub或码云中

1.新建仓库。仓库名称不可重复否则会报错。

2.Git全局设置。打开命令行控制面板,依次执行下面两行代码。注意是分别执行
在这里插入图片描述
3.因为已经有了一个现成的仓库,于是在该项目的目录下,打开powershell,运行以下代码
在这里插入图片描述
不过,在此之前,需要执行git status命令检查git环境是否干净。注意要在该项目目录下。
接着初始化git,使用git init,再次使用git status命令,检查git环境,直到干净为止。
在这里插入图片描述
但是出现还有未上传本地仓库的文件,需要提交。使用git add . 命令,将所有未上传文件上传至本地仓库。
在这里插入图片描述
再次检查git环境是否干净,若显示在主分支上,即可执行那两行代码。出现以下类似代码就证明成功了,刷新页面即可看到上传远程仓库成功。
在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/qq_41189882/article/details/105649001