vue引入elementUi后打开页面报错Uncaught TypeError的解决方式

vue引入elementUi后打开页面报错

本人在用idea创建vue项目并引入elemenUi之后网页报错：
Uncaught TypeError: Cannot read properties of undefined(reading ‘prototype’)。

百度了很多办法都说是因为在vue3中引入了elementUi，vue3.0之后是不支持elementUi的，要使用element plus，但是因为我想用若依偷懒，所以必须得用elementUi，很多文章说是vue - V命令查看vue版本，我敲了命令以后的确是3之后版本，于是卸载重装了2.9.6版本

然而降了版本之后，仍然出现这个问题。通过询问做前端的朋友之后，发现现在的csdn真是鱼龙混杂，好多错误的信息，vue-V命令查看的并不是vue版本，而是脚手架的版本，和vue版本没有半毛钱关系

还有一种方式，就是找到你vue项目的package.json文件，在其中的devDependencies中可以看到你项目使用的vue版本

可以看到即使我降到2.9.6，vue版本仍然在3.0之后，因为2.9.6是脚手架版本。之后我重新下载了脚手架，然后用命令行创建vue项目，记得不要用idea直接new，直接new好像是默认创建vue3的，也可能是我方法不正确。如果使用命令行创建，第一个选项就是让选vue版本的，这里选择vue2即可

用命令行创建完成后,再打开package.json看看

可以看到现在是vue2版本了，引入elementUi，页面可以正常打开，问题解决

总结

到此这篇关于vue引入elementUi后打开页面报错Uncaught TypeError解决的文章就介绍到这了,更多相关vue引入elementUi打开页面报错内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

赞 (0)

相关推荐

  • 利用vue+elementUI实现部分引入组件的方法详解

    前言 vue.js的UI组件库,在git上有多个项目,我见的使用者比较多的是iView和Element.两个组件库,组件都很丰富. 官网的介绍 iView: 一套基于 Vue.js 的高质量 UI 组件库 Element,一套为开发者.设计师和产品经理准备的基于 Vue 2.0 的组件库,提供了配套设计资源,帮助你的网站快速成型. 两者各有优缺点,不多评论,根据自己的需求,我最后使用了Element.因为最近公司开发一个很小的后台项目,所以考虑部分引入element的组件,因为第一次单独引入没有

  • vue项目中如何实现element-ui组件按需引入

    vue项目中如何实现element-ui组件按需引入

    目录 element-ui组件按需引入 按需引入 完整引入 vue项目搭建 + 引入element-ui 初始化单页系统 ElementUI整合项目 element-ui组件按需引入 按需引入 1.借助 babel-plugin-component ,引入我们需要的组件,减少项目体积 npm install babel-plugin-component -D 2.修改 babel.config.js 的内容 //babel.config.js 全文内容如下 module.exports = {

  • element-ui中按需引入的实现

    element-ui中按需引入 为什么选择 element-ui 而不是 iview 因为在多次使用两个组件的过程中慢慢发现,iview 的一些组件还是需要再完善,而 element-ui 现在更加的成熟 所以, 这里我们一起来学习一下在 vue 中按需引入 element-ui 一些组件中的坑(Dialog组件) 这里我们使用的版本是 element-ui : 2.4.7,vue: 2.2.2 1.按需引入 1. 借助 babel-plugin-component,我们可以只引入需要的组件,以

  • vue 2.0项目中如何引入element-ui详解

    vue 2.0项目中如何引入element-ui详解

    前言 本文主要介绍了关于在vue 2.0项目中引入element-ui的相关内容,从新建vue项目到引入组件Element介绍的非常详细,下面话不多说了,来一起看看详细的介绍吧. 一.新建项目 1.查看 node和npm是不是已经安装好命令:node -v  npm -v (没有安装的先安装环境); 2.npm install -g cnpm --registry=https://registry.npm.taobao.org  (安装国内的淘宝镜像文件,后面的安装npm可以全部改为cnpm)

  • vue引入elementUi后打开页面报错Uncaught TypeError的解决方式

    vue引入elementUi后打开页面报错Uncaught TypeError的解决方式

    vue引入elementUi后打开页面报错 本人在用idea创建vue项目并引入elemenUi之后网页报错:Uncaught TypeError: Cannot read properties of undefined(reading ‘prototype’). 百度了很多办法都说是因为在vue3中引入了elementUi,vue3.0之后是不支持elementUi的,要使用element plus,但是因为我想用若依偷懒,所以必须得用elementUi,很多文章说是vue - V命令查看vu

  • 使用MyBatisPlus自动生成代码后tomcat运行报错的问题及解决方法

    自动生成的代码 报错 解决办法:把自动xml文件中自动生成的二级缓存注释掉 总结 到此这篇关于使用MyBatisPlus自动生成代码后tomcat运行报错的问题及解决方法的文章就介绍到这了,更多相关MyBatisPlus自动生成代码tomcat运行报错内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

  • maven引入本地jar包运行报错java.lang.NoClassDefFoundError解决

    目录 正文 maven引入本地jar的示例 配置maven将本地jar打入package中 maven打包知识分享 scope详解 正文 下文笔者讲述maven引入本地jar包时,运行报错"java.lang.NoClassDefFoundError"的处理方法分享,如下所示 今天在编写maven项目    导入本地jar包    部署到服务器上找不到包  报错信息如:java.lang.NoClassDefFoundError那么如何解决呢?   这种问题是由于,本地jar包在打包的

  • 解决Ajax方式上传文件报错"Uncaught TypeError: Illegal invocation"

    今天使用ajax上传文件时,出现了错误.数据传输的方式是通过定义formData完成的,提交的文件对象也设置为dom对象,但是还是不能发送请求.F12看到后台报了个错误:Uncaught TypeError: Illegal invocation,百度了一下,找到了解决方法. 解决方法:在ajax请求的参数中添加如下两个参数: $.ajax({ ..., processData: false, contentType: false, ... }); processData 类型:Boolean

  • JQuery报错Uncaught TypeError: Illegal invocation的处理方法

    JQuery报错Uncaught TypeError: Illegal invocation的处理方法

    Jquery实现Ajax异步提交时报错"Uncaught TypeError: Illegal invocation",如下图: 排查发现错误在于此: 复制代码 代码如下: data:{"search_value":$('input[name=search_value]'),"order_source":buyerType,"order_status":orderType} $('input[name=search_value

  • 解决vue打包后刷新页面报错：Unexpected token <

    前言 今天遇到了一个很怪的问题,在vue-cli+webpack的项目中,刷新特定页面后页面会变空白,报错为index.html文件中Unexpected token <. 怪点一是开发环境没有问题,只有生产环境有问题,怪点二是只有一个页面有问题,其他页面完全正常 正文 报错截图: 根据上面的情况和以往经验,应该在index.html页面及发生错误的页面定位问题,但均解决不了问题. 最后找到此项目的路由处,经过多次测试,解决问题,也确定了问题原由,原来是:路由中path的值不能以小写m开头,否则

  • vue项目打包后打开页面空白解决办法

    网上很多说自己的VUE项目通过Webpack打包生成的list文件,放到HBulider打包后,通过手机打开一片空白.这个主要原因是路径的问题. 1.记得改一下config下面的index.js中bulid模块导出的路径.因为index.html里边的内容都是通过script标签引入的,而你的路径不对,打开肯定是空白的.先看一下默认的路径. module.exports = { build: { env: require('./prod.env'), index: path.resolve(__

  • Vue中axios的封装（报错、鉴权、跳转、拦截、提示）

    统一捕获接口报错 弹窗提示 报错重定向 基础鉴权 表单序列化 实现的功能 统一捕获接口报错 : 用的axios内置的拦截器 弹窗提示: 引入 Element UI 的 Message 组件 报错重定向: 路由钩子 基础鉴权: 服务端过期时间戳和token,还有借助路由的钩子 表单序列化: 我这边直接用 qs (npm模块),你有时间也可以自己写 用法及封装 用法 // 服务层 , import默认会找该目录下index.js的文件,这个可能有小伙伴不知道 // 可以去了解npm的引入和es6引入

  • VUE 项目在IE11白屏报错 SCRIPT1002: 语法错误的解决

    问题现象 项目使用vue/cli3脚手架搭建的前端项目,vue版本为2.6.10. browserslist的配置如下: [ "> 1%", "last 2 versions"] 但开发环境的IE11打开显示白屏,F12打开显示: 分析过程 5306行显示 "./node_modules/_debug@4.1.1@debug/src/browser.js"这个路径报错,由于eval()包含的代码中有ES6的语法,IE不支持,查了网上很多资料

  • 在uni-app中使用element-ui的方法与报错解决

    uni-app的相关UI组件库中可能会没有你想要的功能组件,自己去开发的话需要花很多时间,此时咱们可以将别的UI组件库给安装到uni-app中来,达到直接使用该UI组件库的功能组件,例如,安装element-ui uni-app使用element-ui需安装以下插件 npm i element-ui -S 按需引入组件需要装以下插件 npm install babel-plugin-component -D 当你安装完以上插件后,需要在main.js中进行引入,例如引入全部: import Vu

随机推荐