前端 vue + element-ui 框架从 0 - 1 搭建

1. 安装node

地址: Node.js --- 在任何地方运行 JavaScript

2. 安装 vue

2.1 执行安装命令

复制代码
npm uninstall -g vue-cli 

npm install -g @vue/cli  

安装最新的vue3版本

2.2 使用vue 脚手架 搭建项目

vue create project_name

2.2.1 注意

项目名称不能包含大写

2.3 启动项目

复制代码
        cd 项目名

        npm run serve

3. 安装 element-ui

复制代码
npm i element-ui -S  
vue 2.0 版本安装无异常、3.0 版本提示不匹配
使用 npm install element-plus --save 
vue 3.0 版本 用上面方法安装

3.1 存在下载较慢的情况 配置国内npm镜像

复制代码
npm config set registry https://registry.npmmirror.com/

4. 将 element-ui 配置到 全局 vue

复制代码
import { createApp } from 'vue'
import App from './App.vue'
import elementUi from 'element-plus'

import 'element-plus/dist/index.css'
const app  = createApp(App)
app.use(elementUi)

app.mount('#app')

5. 引入 axios

复制代码
import { createApp } from 'vue'
import App from './App.vue'
import elementUi from 'element-plus'
import Axios from "axios";

import 'element-plus/dist/index.css'
const app  = createApp(App)
app.use(elementUi)
// 导入
app.use(Axios,'axios')

app.mount('#app')
相关推荐
风逸hhh2 小时前
python打卡day29@浙大疏锦行
开发语言·前端·python
LuckyLay2 小时前
Vue百日学习计划Day33-35天详细计划-Gemini版
前端·vue.js·学习
ᖰ・◡・ᖳ2 小时前
JavaScript:PC端特效--缓动动画
开发语言·前端·javascript·css·学习·html5
苹果酱05674 小时前
Golang中的runtime.LockOSThread 和 runtime.UnlockOSThread
java·vue.js·spring boot·mysql·课程设计
会飞的鱼先生4 小时前
vue2、vue3项目打包生成txt文件-自动记录打包日期:git版本、当前分支、提交人姓名、提交日期、提交描述等信息 和 前端项目的版本号json文件
前端·vue.js·git·json
!win !4 小时前
uni-app项目从0-1基础架构搭建全流程
前端·uni-app
c_zyer4 小时前
使用 nvm 管理 Node.js 和 npm 版本
前端·npm·node.js
i_am_a_div_日积月累_5 小时前
Element Plus 取消el-form-item点击触发组件,改为原生表单控件
前端·vue.js·elementui
集成显卡5 小时前
网页 H5 微应用接入钉钉自动登录
前端·后端·钉钉