vue-cli2.x 项目模板文件说明（二）components篇

本文主要针对的是vue/cli2.x项目中src目录下components目录下文件说明及管理，项目整体结构参照 vue-cli 2.x项目模板文件说明（一）整体结构篇

1、*.vue 文件直接参照原始生成模板，单组件引入请参照官网

2、当需要引入的全局组件比较多时，为保持main.js的简洁性，设置index.js文件统一引入组件，然后在main.js中统一引入，index.js文件如下

import  Header from '@/components/Header'
import  Footer from '@/components/Footer'

const components = {
	Header,
	Footer
}
const install = (Vue, opts = {}) => {
	Object.keys(components).forEach( key => {
		Vue.component(key, components[key])
	})
}

export default install

3，在main.js 中引入

import CommonComponent form '@/components/index'
Vue.use(CommonComponent)