使用yarn搭建Vue,ElementUI,axios环境

2023-11-15

1. 搭建vue、ElementUI、axios环境

1.1 安装yarn

安装yarn

npm install -g yarn

查看是否安装版本

yarn --version 

yarn切换为国内源

yarn config set registry https://registry.npm.taobao.org/

1.2 搭建vue、ElementUI、axios环境

1.2.1 创建vue项目element_crud

vue create element_crud

在这里插入图片描述

1.2.2 安装ElementUI

  1. 进入项目目录,添加element-ui依赖
cd element_crud

yarn add element-ui 
  1. main.js中添加如下:
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);

1.2.3 安装axios

  1. 进入项目目录,添加axios依赖
yarn add axios
  1. main.js中添加如下:
import axios from 'axios'
Vue.prototype.$http = axios

1.3 启动项目

yarn serve
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用yarn搭建Vue,ElementUI,axios环境 的相关文章

  • Echarts遇到Vue3时遇到的问题

    将vue2的Echarts代码迁移到了vue3项目上 引发的问题 问题描述 1 点击图例legend时刻度轴偏移 图像不展示 以及报错 初始chart正常 图 点击图例后的chart和报错 图 2 调用resize 不生效且报错 初始正常
  • 使用Vue+xlsx+xlsx-style实现导出自定义样式的Excel文件

    本文就是上一篇 使用Python openpyxl实现导出自定义样式的Excel文件 文章中提到的 之前项目的导出Excel文件操作都是在前端完成的 这段话中基于前端实现的导出Excel文件方法 文档地址 https docs sheetj
  • Vue 读取本地静态文件 json【很全,很详细】

    所有文章优先发布在个人博客上 后续更新可能会忘记同步到CSDN上 给你带来不便抱歉 个人博客此篇文章 https www xdx97 com article 654798704103915520 方法一 require 格式 var jso
  • 【Vue】vue.js中组件的使用

    文章目录 组件 创建全局组件 创建局部组件 组件中的data和methods 组件 组件 Component 是 Vue js 最强大的功能之一 组件可以扩展 HTML 元素 封装可重用的代码 在较高层面上 组件是自定义元素 Vue js
  • vue中使用el-table组件进行分页多选,回显、切换分页记住上一页所勾选和取消的选项

    需求 1 table表格多选 并且切换分页之后能记住上一页的选项 2 回显数据 切换分页之后再切换回来依然能回显数据 3 点击选项 未保存数据 切换页面后再切换回来初始化数据勾选状态 4 全选 取消全选数据正常变化 5 使用了dialog来
  • Vue突然报错 doesn‘t work properly without JavaScript enabled

    突然报错未启用JavaScript 下午演示项目的时候突然给我整了一出JavaScript未启用 当场就把我整尴尬了 然后我怀疑是不是写的路由守卫有问题就注释了再试 发现问题还在 然后经过各种骚操作以后 发现还是报这个js未启用 当场我就不
  • 临时标识--免登陆uuid

    一 什么是临时标识 就是一个字符串 可以让用户查看购物车等需要注册登录的信息 通常用uuid就可以创建这个字符串 临时标识 在请求拦截器中加 存储在vuex中的state userTempId 二 正式开始 1 下载创建uuid 并且生成用
  • Vue整体架构分解

    Vue js的整体架构可以分解为以下几个部分 文章目录 1 数据驱动 2 组件化 3 响应式系统 4 虚拟DOM 5 插件系统 6 单文件组件 7 模板编译 总结 1 数据驱动 Vue的一个核心特点是数据驱动 Vue会在初始化的时候给数据提
  • 学习Vue 之 创建一个 Vue 应用

    文章目录 Vue js 概述 了解 Vue 创建一个 Vue 应用 参考 Vue js 概述 计划学习前端 已有一些HTML js CSS的基础知识 下一步学习Vue js 以下是一些适合新手的Vue js教程 你可以根据自己的实际情况和需
  • React和Vue的区别

    文章目录 React与Vue的相同点 1 都支持服务器渲染 2 都数据驱动视图 3 都遵循组件化的思想 4 都使用虚拟DOM 5 都有状态管理 React与Vue框架的不同点 1 框架本质不同 2 数据流不同 3 监听数据变化的实现原理不同
  • 基于Vue3实现鼠标按下某个元素进行拖动,实时改变左侧或右侧元素的宽度,以及点击收起或展开的功能

    前言 其原理主要是利用JavaScript中的鼠标事件来控制CSS样式 大致就是监听某个DOM元素的鼠标按下事件 以及按下之后的移动事件和松开事件 在鼠标按下且移动过程中 可实时获得鼠标的X轴坐标的值 通过简单计算 可计算出目标元素的宽度
  • Vue实现搜索页面

    目录 一 效果 二 实现 一 效果 实现功能如下图所示 因为被腰斩 样式未调整 二 实现 直接上代码 pages Search vue 搜索页
  • Vue+Element-ui实现表单验证

    文章目录 效果 template js实现 校验通过的实现效果 效果 校验效果 template div div
  • 10.Vue中绑定class属性,模板中传递class属性

    文章目录 class 对象类型 动态绑定 动态切换 动静结合 关于写法 数组类型 多个绑定 在组件上使用 单根组件 多根组件 attrs class 因为class属性的特殊性 可以有多个值 在将v bind 用于 class 时 Vue
  • vue中通过render函数给子组件设置ref

    正常我们的写法是 这样ref不会生效 h是作用在渲染的时候的 而ref是渲染之后才创建的 因此在h函数中使用ref是无效的 render h params gt return h expandRow ref child props row
  • 使用yarn搭建Vue,ElementUI,axios环境

    1 搭建vue ElementUI axios环境 1 1 安装yarn 安装yarn npm install g yarn 查看是否安装版本 yarn version yarn切换为国内源 yarn config set registry
  • 微信公众号 H5 通联支付

    参考 https blog csdn net caimingxian401 article details 96993205 注意 必须使用 setTimeout 箭头函数延迟加载 1 使用 from 表单 提交数据至通联 2 绑定数据 3
  • 利用vue-cli脚手架创建项目

    利用vue cli脚手架创建项目 安装vue cli脚手架 全局安装 npm install g vue cli 使用vue version查看是否安装完成 显示对应版本号 使用命令行创建 vue create 项目名称 default包含
  • 打包vue前端docker镜像

    1 安装好docker环境 docker v 查看是否成功 2编写Dockerfile文件 下面这个dokcerfile的RUN指令不好 当有多个命令需要执行的时候 可以用换行符和连接符隔开 而不是写多个RUN指令 因为那样会增加镜像的构建
  • 使用Vue实现一个当鼠标悬浮时出现,鼠标离开时消失的双层菜单

    前言 分享一个基于Vue实现一个当鼠标悬浮时出现 鼠标离开时消失的双层菜单 同时也是为了以后需要类似的需求时 可以提供一个实现思路 以及可以快速ctrl c和ctrl v操作 提高工作效率 一 示例代码 1 src views Exampl

随机推荐

  • 推荐一本书——《The Scientist and Engineer's Guide to Digital Signal Processing》

    突然在国外的网站上看到一本非常好的数字信号处理的书籍 讲解简介明白 清晰易懂 书籍为免费电子版 地址为 http www dspguide com pdfbook htm
  • day05-编程题

    知识点 方法 题目1 训练 定义一个方法 该方法能够找出两个小数中的较小值并返回 在主方法中调用方法进行测试 训练提示 根据方法的功能描述 方法的参数应该是两个小数 要返回两个小数的较小值 所以返回值类型也是小数类型 解题方案 操作步骤 定
  • QT中学习Opengl---(GLSL简单的使用)

    前言 本文的代码是 LearnOpenGL 中对应代码 这里提供学习 大家喜欢的可去官方网站去看看 https learnopengl cn readthedocs io zh latest https learnopengl cn rea
  • C++的模板特例化template<>

    C 的模板特例化是指当我们定义了一个通用的模板类或模板函数时 如果特定输入参数类型或值需要进行不同的处理 我们可以为这些特定情况提供单独的实现 这就是模板特例化 下面我们将详细介绍C 的模板特例化 假设我们有以下的一个模板类 templat
  • java自学笔记12:java中的集合框架(下)List

    一 学生选课 判断List中课程是否存在 思考 在课程序列中 如何判断是否包含某门或者某几门课程 如果课程序列包含某门课程 如何判断该课程的索引位置 在学生映射表中 如何判断是否包含某个学生ID 又该如何判断是否包含某个学生对象 如果想把课
  • 解读随着教育改革的深入steam教育

    STEAM鼓励孩子勇于创新和探索 打破思维的第三面墙 自古以来 大家都是教育孩子纠正错误 而STEAM可以让孩子们通过与小组实践学习 探索讨论 交流思想和相互帮助 来发现自己的缺点和不足 通过团队合作来弥补自己的劣势 可以说 STEAM是一
  • Pandas 返回Nan值的行索

    Pandas 返回Nan值的行索 通过np where函数查找 gt gt gt df Out 1 0 1 0 0 450319 0 062595 1 0 673058 0 156073 2 0 871179 0 118575 3 0 59
  • Mysql大小写敏感设置(Docker版)

    应用场景 本人由于项目前期使用windows版国产数据库开发 默认就是大小写不敏感的 加上代码规范约束不够 导致代码中SQL大小写不统一 后期有需求要更换数据库 改用Mysql 因为在Linux系统中Mysql默认是大小写敏感的 所以需要对
  • java多线程同步的实现方式

    java多线程同步的实现方式 1 什么时候会出现线程安全问题 2 使用synchronized关键字 2 1修饰方法 2 2 修饰代码块 3 使用重入锁实现线程同步 4 wait与notify方法 5 使用原子变量实现线程同步 关于vola
  • vmospro启动黑屏_VMOS Pro,安卓手机上的虚拟机

    应用名称 VMOS Pro 应用包名 com vmos pro 应用版本 1 1 26 应用大小 28 0MB 适用平台 Android 5 1 版本说明 1 优化电量同步问题 2 优化游戏断触问题 3 设备信息修改加入随机按钮 4 增加横
  • Docker导入导出镜像(镜像迁移)

    打包现有镜像 docker images 命令查看已有镜像列表 docker save命令打包镜像 docker save使用说明 o 选项 用来指定输出文件 将alpine ffmpeg 3 15打包 docker save o alpi
  • Linux定时任务

    Linux定时任务 at命令 语法 at 选项 日期时间 选项 f 指定包含具体指令的任务文件 q 指定新任务的队列名称 l 显示待执行任务的列表 d 删除指定的待执行任务 m 任务执行完成后向用户发送 E mail 日期时间 指定任务执行
  • 通过XSD文件生成JAVA对象

    c Program Files Java jdk1 8 0 101 bin gt xjc exe p io xsd xml encoding UTF 8 xsdTOxml MyField xsd d xsdTOxml Picked up J
  • 如何在uni中实现一个路由守卫

    在uni app中实现路由守卫 可以使用全局的router beforeEach方法来拦截路由导航 以下是一个简单的示例 展示了如何在uni app中实现路由守卫 在上述代码中 我们通过监听beforeRouterEnter事件来实现路由守
  • java.util.LinkedHashMap cannot be cast to Entity

    前后端数据传输转换问题 java util LinkedHashMap cannot be cast to Entity 问题场景 项目前端使用json传输方式 后台接收后对象变成了LinkedHashMap ResponseBody Re
  • 方向包围盒OBB(oriented bounding box)

    制造几何仿真中的碰撞检测通常视为针对刚体对象间的碰撞检测 这样的话可以把非刚体即软体的建模和变形算法对碰撞检测的影响减少到最小 常见成熟的基于包围盒的碰撞检测 box intersection test 算法如 1 沿坐标轴的包围盒AABB
  • Unity3D关于ComputeShader

    由于最近在实验中需要大量循环计算产生网格 所以可能需要GPU的加速 对于compute shader学习下 可能对于做GPU加速有帮助 以下补充修改了转载文章的内容 原文链接 https blog csdn net csharpupdown
  • HTML怎么建立两行四列的li,关于CSS如何实现多行多列布局的方法

    这篇文章主要介绍了CSS实现多行多列的布局的实例代码 需要的朋友可以参考下 1 两列多行 HTML box1 实现两列多行布局 111 222 333 CSS box1 width 500px background EEEEEE box1
  • fortran求解雷诺方程_方程的计算机处理96(5)_C++vs

    计算机语言运用 数值计算9 方程的计算机处理96 5 C vs 计算机 电子线路组成的计算机器 人与计算机则是通过计算机语言 符号系统说给计算机听而交流 计算机语言有低级语言 机器语言 汇编 高级语言 C C C VB PASCAL LIS
  • 使用yarn搭建Vue,ElementUI,axios环境

    1 搭建vue ElementUI axios环境 1 1 安装yarn 安装yarn npm install g yarn 查看是否安装版本 yarn version yarn切换为国内源 yarn config set registry