创建vue+iview项目

背景：新项目确认启动，前端框架使用iview。整个框架说需要研发总监和项目经理（我）搭建，（PS:我估计都是研发总监搭建的，毕竟我刚入职，使用的框架都不熟，还是需要老大去搭建的，我这边估计也就是去熟悉熟悉）

目的：老大不急，我这边也没什么事情，先试着搭建一下看看

创建vue项目，引入iview

1.安装vue       npm install --global vue-cli

     需要安装好nodejs  才可以使用该命令

2.创建vue项目  vue init webpack 【文件名】

     需要安装好nodejs vue webpack 才可以创建项目否则会报错

3.创建项目时需要填写信息

    name   ：  项目名     description   ： 描述信息   author   ： 作者 ........

4.创建完成后使用idea打开文件即可

 5.运行项目

添加npm启动，配置详细信息即可。

6.页面如下

我已经把logo给删掉了，只要启动成功就OK了

7.导入iview    npm install iview --save

8.引用iview

  在路由处添加即可

  

import Vue from 'vue'
import iView from 'iview'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld'
import hello from '@/components/hello'
import 'iview/dist/styles/iview.css'

Vue.use(Router);
Vue.use(iView);

export default new Router({
  routes: [
    {
      path: '/',
      name: 'HelloWorld',
      component: HelloWorld
    },
    {
      path:'/home',
      name:'hello',
      component:hello
    }
  ]
})

 hello为我写的新页面。只需要添加

import iView from 'iview'

import 'iview/dist/styles/iview.css'

就可以了。

9.使用iView

  参考官方地址

10.iview table表格如下