Element UI es un conjunto de bibliotecas de componentes Vue del lado de la PC de código abierto por el equipo front-end de Ele.me. Admite el uso en proyectos vue2 y vue3: ⚫ los proyectos vue2 usan la versión anterior de Element UI ⚫ los proyectos vue3 usan la nueva versión de Element Plus
2. Instale element-ui en el proyecto vue2
3. Introducir elemento-ui
Los desarrolladores pueden importar todos los componentes de element-ui a la vez, o importar solo los componentes de element-ui utilizados de acuerdo con los requisitos: ⚫ Importación completa: la operación es simple, pero se introducirán algunos componentes adicionales que no se utilizan, lo que da como resultado el proyecto el tamaño es demasiado grande ⚫ Importación bajo demanda: la operación es relativamente complicada, pero solo se importarán los componentes utilizados, lo que puede optimizar el tamaño del proyecto
4. Introducción completa
Escriba lo siguiente en main.js:
5. Importación bajo demanda
Con la ayuda de babel-plugin-component, solo podemos introducir los componentes necesarios para reducir el tamaño del proyecto.
Paso 1, instale babel-plugin-component:
Paso 2, modifique el archivo de configuración babel.config.js en el directorio raíz y agregue el nodo de complementos de la siguiente manera:
Paso 3, si solo desea introducir algunos componentes, como Button, debe escribir el siguiente contenido en main.js:
Cree un nuevo módulo element-ui/index.js en el directorio src y declare el siguiente código: