Vue: component library

1、Element UI

  • Element UI is a set of PC-side Vue component libraries open sourced by the front-end team of Ele.me. Supports use in vue2 and vue3 projects:
    ⚫ vue2 projects use the old version of Element UI
    ⚫ vue3 projects use the new version of Element Plus

2. Install element-ui in the vue2 project

3. Introduce element-ui

  • Developers can import all element-ui components at one time, or import only the element-ui components used as needed:
    ⚫ Complete import: The operation is simple, but some additional components that are not used will be introduced, resulting in The project size is too large
    ⚫ Import on demand: The operation is relatively complicated, but only the components used will be imported, which can optimize the project size

4. Complete introduction

  • Write the following in main.js:

5. Import on demand

  • With the help of babel-plugin-component, we can only introduce the required components to reduce the size of the project.
  • Step 1, install babel-plugin-component:
  • Step 2, modify the babel.config.js configuration file in the root directory, and add the plugins node as follows:
  • Step 3, if you only want to introduce some components, such as Button, then you need to write the following content in main.js:
  • Create a new element-ui/index.js module in the src directory, and declare the following code:

Guess you like

Origin blog.csdn.net/u013308709/article/details/128720679