读elementui源码第一天

一、下载element源码，切换到v1.0.0版本。

二、看看src/index.js入口文件干了什么

1. 从packages目录下，导入各个组件

import Pagination from '../packages/pagination';
import Dialog from '../packages/dialog';
import Autocomplete from '../packages/autocomplete';
import Dropdown from '../packages/dropdown';
import DropdownMenu from '../packages/dropdown-menu';
import DropdownItem from '../packages/dropdown-item';
import Menu from '../packages/menu';
import Submenu from '../packages/submenu';
import MenuItem from '../packages/menu-item';
import MenuItemGroup from '../packages/menu-item-group';
import Input from '../packages/input';
import InputNumber from '../packages/input-number';
import Radio from '../packages/radio';
import RadioGroup from '../packages/radio-group';
import RadioButton from '../packages/radio-button';
import Checkbox from '../packages/checkbox';
import CheckboxGroup from '../packages/checkbox-group';
import Switch from '../packages/switch';
import Select from '../packages/select';
import Option from '../packages/option';
import OptionGroup from '../packages/option-group';
/* 待研究1 */
import locale from 'element-ui/src/locale';
...

2.定义install函数，函数内注册组件、挂载一些方法

const install = function(Vue, opts = {}) {
  /* istanbul ignore if */
  if (install.installed) return;
  locale.use(opts.locale);
  
  
/* Vue.component全局注册组件 第一个参数-组件名 */
  Vue.component(Pagination.name, Pagination);
  Vue.component(Dialog.name, Dialog);
  Vue.component(Autocomplete.name, Autocomplete);
  Vue.component(Dropdown.name, Dropdown);
  ...
  
  Vue.use(Loading);

  Vue.prototype.$msgbox = MessageBox;
  Vue.prototype.$alert = MessageBox.alert;
  Vue.prototype.$confirm = MessageBox.confirm;
  Vue.prototype.$prompt = MessageBox.prompt;
  Vue.prototype.$notify = Notification;
  Vue.prototype.$message = Message;
};

3、导出install函数及各组件

module.exports = {
  version: '1.0.0',
  locale: locale.use,
  install,
  Pagination,
  Dialog,
  Autocomplete,
  Dropdown,
  DropdownMenu,
  DropdownItem,
  Menu,
  Submenu,
  ...
 }