目录

一、项目初始化

1、创建项目

2、安装依赖

3、运行项目

 二、编写一个简易的页面

1、引入less、element-ui和axios

---

一、项目初始化

1、创建项目

前提: 安装node.js,并且安装了vue3

不知道怎么安装的小伙伴可以看这里 => 从0开始到vue项目运行搭建教程

找一个文件夹,然后依次执行以下命令

创建项目命令: 

npm init vue@latest

2、安装依赖

执行完成后,他已经给了提示,先cd到项目目录,再执行npm install

cd vue-demo
npm install

3、运行项目

npm run dev

打开网址即可访问 !

 二、编写一个简易的页面

1、引入less、element-ui和axios

打开刚刚创建项目的文件夹,然后拖到vscode里

这就是项目的整体结构了,我们需要关注的点就是components,router和views,后面的主要开发也是在这三项当中 , 接下来打开一个终端,然后依次执行 : 

安装less

npm install less less-loader -D

安装element-plus

npm install element-plus --save

安装axios 

npm install axios --save

然后打开package.json文件可以看见刚刚装的依赖以及版本

再到main.ts文件中全局引入element-plus

// 引入全部组件及样式
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
// 注册全部组件
app.use(ElementPlus)