Vue项目初始化步骤

1.项目初始化

1. 安装 Vue 脚手架
2. 通过 Vue 脚手架创建项目
3. 配置 Vue 路由
4. 配置 Element-UI 组件库
5. 配置 axios 库
6. 初始化 git 远程仓库
7. 将本地项目托管到 github 中

1.安装 Vue 脚手架

npm install vue-cli -g

2-3.通过 Vue 脚手架创建项目、配置 Vue 路由

vue ui

在命令行输入完 vue ui 后会自动打开一个 vue 项目可视化管理页面，如下图

然后选择需要存放的路径

点击在此创建新项目后，为项目起一个名称，并且初始化 git 仓库 init project

手动创建一个配置项目，或者使用一套预设

在功能把面板中选择安装一些主要的功能（默认一定要安装的： Babel 、Router 、Linter / Formatter 、 使用配置文件 ）

选择完功能后继续选择配置，将 Pick a linter / formatter config 选择为 ESLint + Standard config 即可

创建项目后可以将其保存为新预设

创建完成后就看到了这个界面

4.配置 Element-UI 组件库

在左侧导航栏中找到插件这个选项，并且点击右上角的添加插件按钮

在搜索框中查找 vue-cli-plugin-element 插件，选中并安装

配置 vue-cli-plugin-element 插件，将 Fully import (默认) 改为 Import on demand

5.配置 axios 库

在左侧导航栏中找到依赖这个选项，并且点击右上角的安装依赖按钮

在搜索框中查找 axios 插件，选中并安装（注意，是安装到运行依赖）

6.初始化 git 远程仓库

打开 github 并创建一个项目，输入完项目的名称后，一定要把 Add a README file 给取消选择，随后创建项目

项目创建完成后将本地文件和远程仓库连接

在连接之前先查看一下本地仓库的状态 git status

先将所有文件都添加到暂存区 git add .

在本地做一次提交 git commit -m "add files"

提交完成后检查一下状态 git status

在命令行中先输入 git remote add origin https://github.com/Littlesmart3/vue_test.git 命令，随后将本地仓库和 github 仓库关联

1.git branch -M main 2.git push -u origin main

完成上传