【Vue】Element-UI按需引入项目启动报错解决方法

7月前作者：杰肥啊分类：Toy博客阅读(32) 违法举报

这篇具有很好参考价值的文章主要介绍了【Vue】Element-UI按需引入项目启动报错解决方法。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

原因可能是版本不匹配的原因，Vue-Cli脚手架的版本跟element-ui不一致了，按官网的配置已经不太行了。

报错代码

Error: Cannot find module 'babel-preset-es2015'

make sure that all the babel plugins and presets you are using are defined a,前端,vue.js,ui,javascript

解决方式

在babel.config.js将es2015进行替换成@babel/preset-env。

{
  "presets": [["@babel/preset-env", { "modules": false }]], //es2015 替换成 @babel/preset-env
  "plugins": [
    [
      "component",
      {
        "libraryName": "element-ui",
        "styleLibraryName": "theme-chalk"
      }
    ]
  ]
}

启动项目

npm run serve

make sure that all the babel plugins and presets you are using are defined a,前端,vue.js,ui,javascript

明显最终的JS文件的大小少了一些。文章来源地址https://www.toymoban.com/news/detail-631655.html

到了这里，关于【Vue】Element-UI按需引入项目启动报错解决方法的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：如若内容造成侵权/违法违规/事实不符，请点击违法举报进行投诉反馈，一经查实，立即删除！

分享到：

领支付宝红包赞助服务器费用

element-ui按需引入

1、安装elment-ui组件库官方网站在项目的根目录下安装 element-ui 官方网页： 2、找到官方文档官方网站 3、安装 babel-plugin-component 在你的项目根目录下运行该：如： 4、修改 .babelrc 配置文件 vue-li 的 .babelrc 文件里为 babel.config.js 原来的 babel.config.js 文件: 修改后的 babel.config.j

2024年02月04日
浏览(41)
引入element-ui步骤（按需引入和全局引入）

两种引入方式 1）完整引入 2）按需引入借助 babel-plugin-component，我们可以只引入需要的组件，以达到减小项目体积的目的。 a）先安装 babel-plugin-component： b）修改 babel.config.js 的内容 c）创建文件 element.js(名字自定义) d）最后在main.js中添加代码

2024年02月16日
浏览(34)
【VUE】4、VUE项目中引入Element-UI

1、element-ui 官方文档（中文版） 2、安装 element-ui 1、进入项目目录下 2、安装 element-ui 注意： VUE2 使用的是 element-ui，VUE3 使用的是 element-plus 3、引入 element-ui（完整引入） 1、打开 main.js 文件在 main.js 文件中，引入 element-ui 2、注册 element-ui 以上代码便完成了 Element 的引入。需

2024年02月01日
浏览(39)
vue项目引入element-ui的三种方式

通过执行命令vue add element来进行引入通过执行命令npm i element-ui -S安装依赖 main.js文件引入element-ui main.js文件全局引入element-ui样式安装babel-plugin-component 修改babel.config.js文件 main.js按需引入组件

2024年02月11日
浏览(35)
Vue2自己封装的基础组件库或基于Element-ui再次封装的基础组件库，如何发布到npm并使用（支持全局或按需引入使用），超详细

以下我以 wocwin-admin-vue2 项目为例修改目录结构，最终如下 1、导入组件，组件必须声明 name 2、定义 install 方法，接收 Vue 作为参数。如果使用 use 注册插件，则所有的组件都将被注册 3、导出的对象必须具有 install，才能被 Vue.use() 方法安装（全局使用） 4、按需引入 5、packa

2024年02月08日
浏览(61)
vue2创建项目的两种方式，配置路由vue-router，引入element-ui

提示：vue2依赖node版本8.0以上使用@vue/cli脚手架vue create创建使用vue-cli脚手架vue init webpack创建 1、查看nodejs版本 2、全局安装vue脚手架和webpack脚手架 3、新建vue2项目创建选项除了，Install vue-router?？选择是，其他选择的否 4、安装依赖并启动文件 5、预览 6、目录结构 1、如果安

2024年04月14日
浏览(30)
NodeJS+Vue+Element-Ui/Plus+Axios+Vue-router+vuex 详细下载、安装、创建项目、引入

1.下载过程默认下一步（1）这个是官网全版目录，下载太慢（一般下载不了）；但是它写了所有nodejs和npm相互对应的版本，可以以此为参考、防止版本不对应； NodeJS各个历史版本下载 https://nodejs.org/zh-cn/download/releases/ （2）这里有一个快速下载地址，只有16.18.1这个版本，但这

2023年04月18日
浏览(39)
Vue2项目打包时，引入element-ui 配置 CDN 加速时报错 Cannot read properties of undefined (reading ‘prototype‘)

Vue2项目打包优化时，引入element-ui 配置 CDN 加速时报错出现报错信息：Uncaught TypeError: Cannot read properties of undefined (reading \\\'prototype\\\') 老师说出现这个问题的原因是，如果你完整引入了 Element，它会为 Vue.prototype 添加如下全局方法：$alert, $promp...... 所以，如果想要正常使用

2024年02月16日
浏览(31)
【Vue框架】Vue2中element-ui/mint-ui组件库——element-ui引入组件以及使用案例、mint-ui引入组件及使用案例

element-ui 提供了大量的组件，如：布局组件、表单组件、JS组件等等。 Element-ui官网： https://element.eleme.cn/#/zh-CN 安装 Element-ui： npm i element-ui -S 1.1.1 引入组件引入 Element 完整引入(在 main.js 中写入以下内容)：按需引入借助 babel-plugin-component，我们可以只引入需要的组件，以达到

2024年02月07日
浏览(38)
Vue2 - 引入Element-UI组件样式

官方文档 https://element.eleme.cn/#/zh-CN/component/installation 推荐使用 npm 的方式安装，它能更好地和 webpack 打包工具配合使用。在终端cd到项目文件夹下安装也可以通过CDN（不推荐）目前可以通过 unpkg.com/element-ui 获取到最新版本的资源，在页面上引入 js 和 css 文件即可开始使用。

2024年02月06日
浏览(48)