Element-UI安装与使用

2024-05-07 06:32:09

ElementUI安装

vue-cli-plugin-element
npm和CDN

npm安装

使用npm安装element-ui

npm i element-ui -S

报了如下错误：

Invalid response body while trying to fetch https://registry.npmjs.org/async-validator: Integrity verification

尝试清除缓存

npm cache clear --force
# 或者
npm cache verify

然后再安装就成功了。
搜资料的时候也有遇到Response timeout报错的解决办法，先收藏起来。

babel-plugin-component插件

ElementUI官方安装教程
这里有个问题：
官方提供了按需引入Element的方法，其中提到修改.babelrc，但是我的项目里没有.babelrc文件，只有babel.config.js。（后来才发现这是因为我使用的vue3 ，然鹅支持vue3的是elementUI升级版elementPLUS,所以安装过程才不一样。）
关于这个问题解决方案看这里
babel官方文档有提到：
babel.config.js是项目范围的配置文件，
.babelrc是文件相关配置，他允许为包的子部分进行相关配置。

npm

然后回头研究了下npm报的错

element-ui@2.15.2 requires a peer of vue@^2.5.17 but none is installed. You must install peer dependencies yourself

搞了半天原来element-ui只适用于vue2，而我的项目用的vue3，换成element-plus重来

npm install element-plus --save
npm uninstall element-ui

安装postcss

安装完element plus还有这个报错需要处理

postcss-modules-local-by-default@4.0.0 requires a peer of postcss@^8.1.0 but none is installed. You must instal
l peer dependencies yourself.

postcss-modules-local-by-default插件需要安装postcss，

npm install postcss@^8.1.0

postcsss是什么？搜了一下这篇15年的介绍postcss的文章，当然过去这么多年，postcss肯定有很大的发展。这是关于postcss8插件迁移的文章。然后又接触到了CSS Modules的概念

查看已安装的某插件版本

想要查看某插件的版本可以使用一下命令

npm ls <插件名称>
# 或者ls换成ls/la/ll
# la/ll除了版本号还会输出插件git和官网地址信息

相关资源链接

core-js

npm中-s 和 -D的区别

Element-UI安装与使用相关推荐

vue学习笔记-关于element ui 安装失败的问题解决
今天学习vue时,对element ui进行安装,运行npm install element-ui -S 命令,出现报错: npm ERR! code ERESOLVE npm ERR! ERESOL ...
Element UI极简教程(1)：Element UI的安装
Java大联盟致力于最高效的Java学习关注 B 站搜索:楠哥教你学Java 获取更多优质视频教程 Element UI 简介 Element UI 是一套基于 Vue 的桌面端组件库,封装好 ...
vue + element ui 的后台管理系统框架_从零开始搭建 VUE + Element UI后台管理系统框架...
点击右上方红色按钮关注"web秀",让你真正秀起来前言后台管理系统前端框架,现在很流行的形式都是,上方和左侧都是导航菜单,中间是具体的内容.比如阿里云.七牛云.头条号.百家号等 ...
【Vue 快速入门】从零开始搭建 VUE + Element UI后台管理系统框架
[Vue 快速入门]从零开始搭建 VUE + Element UI后台管理系统框架前言后台管理系统前端框架,现在很流行的形式都是,上方和左侧都是导航菜单,中间是具体的内容.比如阿里云.七牛云.头条 ...
安装 Element UI 3.0 （即 Element UI Plus）正确方法
首先官网推荐的安装方法没有生成dist文件,导致样式表等这些文件并没有生成 npm install element-plus --save 以上方法是有问题的,如果不幸执行了上面的命令,那么先执行卸载 ...
Vue安装element ui踩坑
在vue安装element ui 的过程中报了许多错误,慢慢踩坑,希望能帮到各位 1. 输入 vue add element 输入 y y zh-CN 如果报错 ERROR comman ...
nodeJs + webpack+vue+ element ui 环境安装
一.安装nodeJs 1.打开NodeJs官网:https://nodejs.org/en/download/ 点击下载 2.双击安装,安装过程基本直接"NEXT"就可以了.(w ...
Vue 安装 Element UI时报错 code ERESOLVE unable to resolve dependency tree
检查当前版本是否为 npm 7.x,7.x对树依赖检查更严格,需要在命令后增加--legacy-peer-deps以规避此报错,在安装其他依赖时如果报错类似也可如此解决,当然也可以将npm降级到6.x ...
vue安装并导入Element UI
首先,在Vue项目的终端输入:npm i element-ui -S (输入之后,回车,等待一会儿,就会出现下图红框以下的内容,表示已经安装成功) 然后,在main.js中添加: import Ele ...
charts混合使用 elementui和e_vue模块化(echart+element ui)
最近看了下vue的框架,随手做了个项目,记录分享下技术框架: vue.js + webpack + element ui + echart 首先看下npm package.js 上面的图主要是配置 ...

最新文章

热门文章