关于iview:iview简单使用按需导入

iview简略应用(按需导入)

1.开发环境 vue+iview
2.电脑系统 windows10专业版
3.在开发的过程中,咱们常常会应用到iview进行开发,然而很多时候咱们只是须要应用到iview的几个组件,如果咱们把所有的组件装置的话,会造成我的项目过大,上面我来简略的分享一下,iview怎么按需导入,心愿对你有所帮忙!
4.在终端输出以下命令(以管理员身份运行):

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

5.在bable.config.js中增加如下代码:

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

6.在main.js中增加如下代码:

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

7.在vue组件中增加如下代码:

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

8.本期的分享到了这里就完结啦,是不是很nice,心愿对你有所帮忙,让咱们一起致力走向巅峰!

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理