Installez element-ui dans vue2.x en trois étapes

environnement

vue2.x
element-ui

Trilogie d'installation et de configuration

Il s'agit d'un import global, qui sera complété sur demande ultérieurement, vous pouvez voir l'explication sur le site officiel

1. exécution de la ligne de commande

yarn add element-ui

2. Introduisez element-ui et ses fichiers de style dans le fichier d'entrée de programme main.js dans le projet vue

import ElementUI from "element-ui"; // 2.1引入结构
import "element-ui/lib/theme-chalk/index.css"; // 2.2引入样式
Vue.use(ElementUI);

3. Ajoutez le code du bouton sur le site officiel element-ui au fichier d'entrée de page App.vue et testez-le

 <el-button type="primary">主要按钮</el-button>

L'effet final :

code complet

1. Fichier App.vue complet :

<template>
  <div id="app">
    <el-button type="primary">主要按钮</el-button>
  </div>
</template>

<script>
export default {
    
    
  name: "App",
};
</script>

<style lang="less">
#app {
    
    
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
}
body {
    
    
  background-color: #c1ceca;
}

nav {
    
    
  padding: 0.3623rem;

  a {
    
    
    font-weight: bold;
    color: #2c3e50;

    &.router-link-exact-active {
    
    
      color: #42b983;
    }
  }
}
</style>

2. Le fichier main.js complet :

import Vue from "vue";
import App from "./App.vue";
import ElementUI from "element-ui"; // 1引入结构
import "element-ui/lib/theme-chalk/index.css"; // 2引入样式

Vue.config.productionTip = false;
Vue.use(ElementUI);
new Vue({
    
    
  render: (h) => h(App),
}).$mount("#app");

Avis

Les bibliothèques de composants d'éléments correspondant aux différentes versions de Vue sont différentes !

• Vue2.x correspond à la bibliothèque de composants element-ui
• Vue3.x correspond à la bibliothèque de composants element-plus

Problèmes rencontrés lors de l'installation

Impossible de trouver le fichier node_modules/async-validator/es/index.js