在使用material-ui 作为布局的项目中使用storybook 测试组件
- 安装create-react-app
npx create-react-app my-app
2.安装 material-ui相关库类
yarn add material-ui/core material-ui/icons
3.安装storybook
facebook 官方指南 里面有详细介绍，反正我写的也是不对的。
以上便配置好了相关环境，但是由于material-ui组件会使用withstyles 封装组件，而storybook原生必须要使用addDecorator给组件添加修饰器，显然这里面有很多值得研究的地方，而我并没有那么多时间去研究，所以直接google了一下，解决方法是安装相关插件： storybook-addon-material-ui。
yarn add storybook-addon-material-ui // 一步到位
使用方法：
/// Login.stories.js
import React from 'react'
import {storiesOf, addDecorator} from '@storybook/react';
import {muiTheme} from 'storybook-addon-material-ui';
import Login from './index.js';
storiesOf("Login", module)
.addDecorator(muiTheme())
.add("Login Component Test", () => (
<Login />
))
实际上storybook可以添加一个插件，而我们伟大的一线开发者已经为我们写好相应的插件，直接使用即可。
关于SPA 开发流程：
- 组件分离开发。
- 组件分离测试。
- 组件组合页面。
- 组件页面测试。
- redux内容编写。
- fake datas 编写。
- routers 编写。
- 测试。
