IView easy to use (import on demand)

Time:2021-5-6

IView easy to use (import on demand)

1. Development environment Vue + iView
2. Computer system Windows 10 professional edition
3. In the process of development, we often use iView for development, but many times we just need to use several components of iView. If we install all the components, the project will be too large. Let me share how to import iView on demand. I hope it will help you!
4. Enter the following command in the terminal (run as an administrator):

npm add view-design
npm install babel-plugin-import --save-dev

5. Add the following code in bable.config.js:
IView easy to use (import on demand)

"plugins": [["import", {
    "libraryName": "view-design",
    "libraryDirectory": "src/components"
  }]]

6. Add the following code in main.js:

import 'view-design/dist/styles/iview.css'; // Import styles
import { Button, Table  } from 'view-design';
Vue.component('Button', Button);
Vue.component('Table', Table);

7. Add the following code to Vue component:

<Button type="primary" shape="circle">Circle</Button>

8. The sharing of this issue ends here, isn’t it nice? I hope it can help you, let’s work hard to reach the peak together!