当前位置: 首页 > web >正文

前端 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')

http://www.xdnf.cn/news/7360.html

相关文章:

  • React组件开发流程-03.1
  • go 数据类型转换
  • 5个yyds的.Net商城开源项目
  • [特殊字符] Word2Vec:将词映射到高维空间,它到底能解决什么问题?
  • 【Spring Boot 整合 MongoDB 完整指南】
  • sentinel核心原理-高频问题
  • Android设备 显示充电速度流程
  • 使用 Terraform 创建 Azure Databricks
  • Milvus 从 v2.4.12 升级到 v2.5.11 的实施方案
  • 基于Qt的app开发第九天
  • disryptor和rabbitmq
  • 【notes】VScode 使用总结
  • 数据仓库面试题合集②】ETL 设计与调度策略详解
  • MYSQL故障排查和环境优化
  • kotlin flow的写法
  • 【Pandas】pandas DataFrame pct_change
  • 24、钢铁厂峰谷电价策略优化分析 - /能源管理组件/steel-plant-tou-optimization
  • ngx_http_scgi_module 技术指南
  • Python60日基础学习打卡D30
  • 从技术层⾯来说深度SEO优化的⽅式有哪些?
  • CEF源码历史版本编译避坑指南
  • 基于 Keil 的 STM32 全模块开发
  • Windows系统编译Qt使用的kafka(librdkafka)
  • vue2、vue3项目打包生成txt文件-自动记录打包日期:git版本、当前分支、提交人姓名、提交日期、提交描述等信息 和 前端项目的版本号json文件
  • 47、C#可否对内存进⾏直接的操作?
  • 【Unity网络编程知识】Unity的 UnityWebRequest相关类学习
  • 测试自动化开发框架全解析
  • winfrom中创建webapi
  • VTK|显示三维图像的二维切片
  • 【2025最新】Spring Boot + Spring AI 玩转智能应用开发