idea创建vue项目，引用elementUI并从springboot项目获取数据2：引用elementUI

原创于 2022-10-12 14:38:12 发布 · 996 阅读

收录于

软件开发很简单

vue相关开发，若依框架使用专栏收录该内容

64 篇文章 ¥19.90 ¥99.00

订阅专栏

超级会员免费看

本文介绍了如何在Vue项目中引入ElementUI，包括安装element-plus，检查package.json，修改helloworld.vue添加控件，以及更新main.js加载库和样式。在完成这些步骤后，通过npm run serve启动服务并验证页面效果，成功实现了ElementUI的集成。

有了vue项目，我们就可以开始折腾了。首先要加入elementUI.

1.加入elementUI

运行：

npm install element-plus --save --legacy-peer-deps

我们前面安装的是vue3.0以上，实际上是vue5.0.8版本，所以我们在这里最好使用elementui3 ，也就是element-plus，这样可能出现的问题会少一些。

看看package.json中是否安装成功。出现下面的结果就是安装成功了：

 "dependencies": {
    "core-js": "^3.8.3",
    "element-plus": "^2.2.17",
    "vue": "^3.2.13"
  },

2、打开helloword.vue，在这个页面加入elementui的控件，看看能不能正常运行。

<template>
  <div class="hello">
    <h1>{
  
  { msg }}</h1>
    <p>
      For a guide and recipes on how to configure / customize this project,<br>
      check out the
      <a href="https://cli.vuejs.org/" target="_blank" rel="noopener">

标签

#elementui #vue.js #spring boot