通过几个项目的了解,个人感觉iview框架是vue框架中比较容易上手,比较好用的框架,主要是各种例子比较齐全,且网上的资料比较多,易于查找。
废话不多说附上步骤:
一:iview (pc端前端框架)安装
npm install iview --save
二:一般在 webpack 入口页面 main.js 中如下配置
import iView from 'iview'; import 'iview/dist/styles/iview.css'; Vue.use(iView);
三:iview 按需引入
借助插件 babel-plugin-import可以实现按需加载组件,减少文件体积。首先安装,并在文件 .babelrc 中配置: npm install babel-plugin-import --save-dev 按需引用仍然需要导入样式,即在 main.js 或根组件执行 import 'iview/dist/styles/iview.css'; // .babelrc { "plugins": [["import", { "libraryName": "iview", "libraryDirectory": "src/components" }]] } 然后这样按需引入组件,就可以减小体积了: import { Button, Table } from 'iview'; Vue.component('Button', Button); Vue.component('Table', Table);
好了,很简单吧,顺便附上iview框架首页地址:http://v1.iviewui.com/