Optimise bundle size, clean Icon, change over on SideBarItem

README.md

@@ -5,7 +5,7 @@
 
 ## Requirements
 
-* nodejs v8.x (https://nodejs.org/en/)
+* nodejs v9.x (https://nodejs.org/en/)
 * yarn latest (https://yarnpkg.com/fr/docs/install)
 
 ## Setup
@@ -38,6 +38,12 @@ yarn start
 yarn dist:dir
 ```
 
+> Check bundle size
+
+```
+BUNDLE_ANALYZER=1 yarn dist:dir
+```
+
 > Package everything
 
 ```

electron-builder.yml

@@ -46,18 +46,22 @@ files:
   - dist/internals
 
   # Exclude files
+  - "!report-*.html"
   - "!node_modules/**/{CONTRIBUTORS,License,CNAME,AUTHOR,TODO,CONTRIBUTING,COPYING,INSTALL,NEWS,PORTING,Makefile,htdocs,CHANGELOG,ChangeLog,changelog,README,Readme,readme,test,sample,example,demo,composer.json,tsconfig.json,jsdoc.json,tslint.json,typings.json,gulpfile,bower.json,package-lock,Gruntfile,CMakeLists,karma.conf,yarn.lock}*"
-  - "!node_modules/**/{man,flow-typed,benchmark,node_modules,spec,cmake,browser,vagrant,doxy*,bin,obj,obj.target,example,examples,test,tests,doc,docs,msvc,Xcode,CVS,RCS,SCCS}{,/**/*}"
+  - "!node_modules/**/{man,flow-typed,benchmark,node_modules,spec,cmake,browser,vagrant,doxy*,bin,obj,obj.target,example,examples,test,tests,__tests__,mocks,__mocks__,doc,docs,msvc,Xcode,CVS,RCS,SCCS,.storybook}{,/**/*}"
   - "!node_modules/**/*.{conf,png,pc,coffee,txt,spec.js,ts,js.flow,html,def,jst,xml,ico,in,ac,sln,dsp,dsw,cmd,vcproj,vcxproj,vcxproj.filters,pdb,exp,obj,lib,map,md,sh,gypi,gyp,h,cpp,yml,log,tlog,Makefile,mk,c,cc,rc,xcodeproj,xcconfig,d.ts,yaml,hpp}"
 
   # Exclude modules
+  - "!node_modules/@ledgerhq/**/src{,/**/*}"
   - "!node_modules/7zip-bin-{mac,linux,win}{,/**/*}"
   - "!node_modules/7zip-bin{,/**/*}"
+  - "!node_modules/ajv/dist{,/**/*}"
   - "!node_modules/app-builder-bin-{mac,linux,win}{,/**/*}"
   - "!node_modules/app-builder-bin{,/**/*}"
   - "!node_modules/app-builder-util{,/**/*}"
   - "!node_modules/axios/dist{,/**/*}"
   - "!node_modules/builder-util{,/**/*}"
+  - "!node_modules/d3-*/src{,/**/*}"
   - "!node_modules/dmg-builder{,/**/*}"
   - "!node_modules/downshift/preact{,/**/*}"
   - "!node_modules/electron-builder-lib{,/**/*}"
@@ -66,13 +70,20 @@ files:
   - "!node_modules/electron{,/**/*}"
   - "!node_modules/fuse.js/src{,/**/*}"
   - "!node_modules/jsqr/test-data{,/**/*}"
-  - "!node_modules/ledger-test-library/deps/{djinni,gyp}{,/**/*}"
+  - "!node_modules/ledger-test-library/{deps,android,djinni,objc}{,/**/*}"
-  - "!node_modules/lodash-es{,/**/*}"
+  - "!node_modules/lodash-{es,fp}{,/**/*}"
-  - "!node_modules/moment/src{,/**/*}"
+  - "!node_modules/lodash/fp{,/**/*}"
+  - "!node_modules/moment/{src,min}{,/**/*}"
   - "!node_modules/node-gyp{,/**/*}"
+  - "!node_modules/numeral/{src,min,templates,locales}{,/**/*}"
   - "!node_modules/opencollective{,/**/*}"
+  - "!node_modules/qrcode/build{,/**/*}"
   - "!node_modules/raven-js/dist{,/**/*}"
+  - "!node_modules/react-dom/umd{,/**/*}"
+  - "!node_modules/react-qr-reader/src{,/**/*}"
+  - "!node_modules/react/umd{,/**/*}"
   - "!node_modules/rxjs{,/**/*}"
+  - "!node_modules/source-map/dist{,/**/*}"
   - "!node_modules/styled-components/src{,/**/*}"
   - "!node_modules/victory-chart/{es,dist,src}{,/**/*}"
   - "!node_modules/victory-core/{es,dist,src}{,/**/*}"

package.json

@@ -43,11 +43,6 @@
     "webpack-sources": "1.0.1"
   },
   "dependencies": {
-    "@fortawesome/fontawesome": "^1.1.4",
-    "@fortawesome/fontawesome-free-brands": "^5.0.7",
-    "@fortawesome/fontawesome-free-regular": "^5.0.7",
-    "@fortawesome/fontawesome-free-solid": "^5.0.7",
-    "@fortawesome/react-fontawesome": "^0.0.17",
     "@ledgerhq/currencies": "^4.5.0",
     "@ledgerhq/hw-app-btc": "^4.2.2",
     "@ledgerhq/hw-app-eth": "^4.2.0",
@@ -142,6 +137,7 @@
     "prettier": "^1.11.1",
     "react-hot-loader": "^4.0.0",
     "react-test-renderer": "^16.2.0",
-    "webpack": "^3.11.0"
+    "webpack": "^3.11.0",
+    "webpack-bundle-analyzer": "^2.11.1"
   }
 }

src/components/ReceiveBox.js

@@ -13,7 +13,6 @@ import { sendEvent } from 'renderer/events'
 import Box from 'components/base/Box'
 import Button from 'components/base/Button'
 import CopyToClipboard from 'components/base/CopyToClipboard'
-import Icon from 'components/base/Icon'
 import Print from 'components/base/Print'
 import QRCode from 'components/base/QRCode'
 import Text from 'components/base/Text'
@@ -158,7 +157,6 @@ class ReceiveBox extends PureComponent<Props, State> {
             data={address}
             render={copy => (
               <Action onClick={copy}>
-                <Icon name="clone" />
                 <span>{'Copy'}</span>
               </Action>
             )}
@@ -167,13 +165,11 @@ class ReceiveBox extends PureComponent<Props, State> {
             data={{ address, amount }}
             render={(print, isLoading) => (
               <Action onClick={print}>
-                <Icon name="print" />
                 <span>{isLoading ? '...' : 'Print'}</span>
               </Action>
             )}
           />
           <Action>
-            <Icon name="share-square" />
             <span>{'Share'}</span>
           </Action>
         </Box>

src/components/RecipientAddress/index.js

@@ -6,12 +6,13 @@ import QrReader from 'react-qr-reader'
 import noop from 'lodash/noop'
 
 import Box from 'components/base/Box'
-import Icon from 'components/base/Icon'
 import Input from 'components/base/Input'
 
-const IconQrCode = ({ onClick }: { onClick: Function }) => (
+import IconQrCode from 'icons/QrCode'
+
+const WrapperIcon = ({ onClick }: { onClick: Function }) => (
   <Box color="graphite" style={{ position: 'absolute', right: 15 }}>
-    <Icon fontSize={30} name="qrcode" style={{ cursor: 'pointer' }} onClick={onClick} />
+    <IconQrCode height={30} width={30} style={{ cursor: 'pointer' }} onClick={onClick} />
   </Box>
 )
 
@@ -67,7 +68,7 @@ class RecipientAddress extends PureComponent<Props, State> {
         <InputAddress value={value} withQrCode={withQrCode} onChange={onChange} />
         {withQrCode && (
           <Fragment>
-            <IconQrCode onClick={this.handleClickQrCode} />
+            <WrapperIcon onClick={this.handleClickQrCode} />
             {qrReaderOpened && (
               <WrapperQrCode>
                 <QrReader

src/components/SideBar/Item.js

@@ -43,7 +43,11 @@ const Container = styled(Tabbable).attrs({
 
   &:hover,
   &:focus {
-    background: ${p => p.theme.colors.lightGrey};
+    opacity: 1;
+
+    svg {
+      color: ${p => p.theme.colors[p.iconActiveColor] || p.iconActiveColor};
+    }
   }
 `
 
@@ -77,12 +81,13 @@ function Item({
   return (
     <Container
       big={big}
+      iconActiveColor={iconActiveColor}
+      isActive={isActive}
       onClick={
         linkTo
           ? isActive ? undefined : () => push(linkTo)
           : modal ? () => openModal(modal) : void 0
       }
-      isActive={isActive}
     >
       {icon && <Box color={isActive ? iconActiveColor : void 0}>{icon}</Box>}
       <Box justifyContent="center">

src/components/base/Button/index.js

@@ -9,9 +9,6 @@ import { darken, lighten } from 'styles/helpers'
 
 import fontFamily from 'styles/styled/fontFamily'
 
-import Box from 'components/base/Box'
-import Icon from 'components/base/Icon'
-
 const Base = styled.button.attrs({
   ff: 'Museo Sans|Regular',
   fontSize: 3,
@@ -85,20 +82,12 @@ function getProps({ disabled, icon, primary }: Object) {
 }
 
 const Button = (props: Props) => {
-  const { onClick, primary, icon, disabled } = props
+  const { onClick, children, primary, disabled } = props
-  let { children } = props
-  children = icon ? (
-    <Box alignItems="center" justifyContent="center">
-      <Icon name={icon} />
-    </Box>
-  ) : (
-    children
-  )
 
   return (
     <Base
       {...props}
-      {...getProps({ primary, icon, disabled })}
+      {...getProps({ primary, disabled })}
       disabled={disabled}
       onClick={disabled ? undefined : onClick}
     >

src/components/base/CheckBox/index.js

@@ -5,7 +5,7 @@ import noop from 'lodash/noop'
 import styled, { keyframes } from 'styled-components'
 
 import { Tabbable } from 'components/base/Box'
-import Icon from 'components/base/Icon'
+import IconCheck from 'icons/Check'
 
 const bounce = keyframes`
   0% {
@@ -20,6 +20,7 @@ const bounce = keyframes`
 `
 
 const Base = styled(Tabbable).attrs({
+  color: 'white',
   alignItems: 'center',
   justifyContent: 'center',
 })`
@@ -40,9 +41,7 @@ const Base = styled(Tabbable).attrs({
   }
 `
 
-const IconWrapper = styled(Icon).attrs({
+const IconWrapper = styled(IconCheck)`
-  color: 'white',
-})`
   animation: ${bounce} ease-in-out 350ms;
 `
 
@@ -55,7 +54,7 @@ function CheckBox(props: Props) {
   const { isChecked, onChange, ...p } = props
   return (
     <Base isChecked={isChecked} onClick={() => onChange && onChange(!isChecked)} {...p}>
-      {isChecked && <IconWrapper name="check" />}
+      {isChecked && <IconWrapper height={7} width={7} />}
     </Base>
   )
 }

src/components/base/Icon/index.js

@@ -1,19 +0,0 @@
-// @flow
-
-import React from 'react'
-import styled from 'styled-components'
-import { fontSize, color } from 'styled-system'
-import FontAwesomeIcon from '@fortawesome/react-fontawesome'
-
-const Container = styled.span`
-  ${fontSize};
-  ${color};
-  display: inline-flex;
-  position: relative;
-`
-
-export default ({ name, ...props }: { name: string | Object }) => (
-  <Container {...props}>
-    <FontAwesomeIcon icon={name} />
-  </Container>
-)

src/components/base/Icon/stories.js

@@ -1,36 +0,0 @@
-// @flow
-
-import React from 'react'
-import { storiesOf } from '@storybook/react'
-import { text, number } from '@storybook/addon-knobs'
-
-import Icon from 'components/base/Icon'
-
-const stories = storiesOf('Components/Icon', module)
-
-const Wrapper = ({ children }: { children: any }) => (
-  <div>
-    <div style={{ opacity: 0.2 }}>
-      (Change the icon value with{' '}
-      <a
-        href="https://fontawesome.com/icons?d=gallery&s=regular,solid&m=free"
-        target="_blank"
-        style={{ cursor: 'pointer' }}
-      >
-        FontAwesome
-      </a>{' '}
-      icon)
-    </div>
-    {children}
-  </div>
-)
-
-stories.add('basic', () => (
-  <Wrapper>
-    <Icon
-      color={text('color', 'black')}
-      fontSize={number('fontSize', 5)}
-      name={text('icon', 'check')}
-    />
-  </Wrapper>
-))

src/components/base/Modal/index.js

@@ -17,9 +17,10 @@ import { closeModal, isModalOpened, getModalData } from 'reducers/modals'
 
 import Box, { Tabbable } from 'components/base/Box'
 import GrowScroll from 'components/base/GrowScroll'
-import Icon from 'components/base/Icon'
 import Defer from 'components/base/Defer'
 
+import IconCross from 'icons/Cross'
+
 const springConfig = {
   stiffness: 380,
 }
@@ -216,7 +217,7 @@ export const ModalBody = ({
   <Body>
     {onClose && (
       <CloseContainer onClick={onClose}>
-        <Icon fontSize={6} name="times" />
+        <IconCross height={16} width={16} />
       </CloseContainer>
     )}
     <Box p={5} {...props}>

src/components/base/Select/index.js

@@ -9,11 +9,12 @@ import type { Element } from 'react'
 
 import Box from 'components/base/Box'
 import GrowScroll from 'components/base/GrowScroll'
-import Icon from 'components/base/Icon'
 import Input from 'components/base/Input'
 import Search from 'components/base/Search'
 import Text from 'components/base/Text'
 
+import IconCheck from 'icons/Check'
+
 import Triangles from './Triangles'
 
 type Props = {
@@ -170,7 +171,7 @@ class Select extends PureComponent<Props> {
                   </Box>
                   <Box>
                     <IconSelected selected={selectedItem === item}>
-                      <Icon name="check" />
+                      <IconCheck height={15} width={15} />
                     </IconSelected>
                   </Box>
                 </Item>

src/components/modals/SettingsAccount.js

@@ -17,9 +17,10 @@ import Button from 'components/base/Button'
 import Input from 'components/base/Input'
 import Modal, { ModalBody } from 'components/base/Modal'
 import Text from 'components/base/Text'
-import Icon from 'components/base/Icon'
 import Label from 'components/base/Label'
 
+import IconEdit from 'icons/Edit'
+
 type State = {
   accountName: string | null,
   minConfirmations: number | null,
@@ -196,7 +197,7 @@ class SettingsAccount extends PureComponent<Props, State> {
                 {!editName &&
                   nameHovered && (
                     <Box onClick={this.handleEditName(true)} style={{ cursor: 'pointer' }}>
-                      <Icon name="edit" />
+                      <IconEdit height={16} width={16} />
                     </Box>
                   )}
               </Box>

src/icons/Cross.js

@@ -0,0 +1,10 @@
+import React from 'react'
+
+export default props => (
+  <svg viewBox="0 0 384 512" {...props}>
+    <path
+      fill="currentColor"
+      d="M323.1 441l53.9-53.9c9.4-9.4 9.4-24.5 0-33.9L279.8 256l97.2-97.2c9.4-9.4 9.4-24.5 0-33.9L323.1 71c-9.4-9.4-24.5-9.4-33.9 0L192 168.2 94.8 71c-9.4-9.4-24.5-9.4-33.9 0L7 124.9c-9.4 9.4-9.4 24.5 0 33.9l97.2 97.2L7 353.2c-9.4 9.4-9.4 24.5 0 33.9L60.9 441c9.4 9.4 24.5 9.4 33.9 0l97.2-97.2 97.2 97.2c9.3 9.3 24.5 9.3 33.9 0z"
+    />
+  </svg>
+)

src/icons/Edit.js

@@ -0,0 +1,10 @@
+import React from 'react'
+
+export default props => (
+  <svg viewBox="0 0 576 512" {...props}>
+    <path
+      fill="currentColor"
+      d="M402.6 83.2l90.2 90.2c3.8 3.8 3.8 10 0 13.8L274.4 405.6l-92.8 10.3c-12.4 1.4-22.9-9.1-21.5-21.5l10.3-92.8L388.8 83.2c3.8-3.8 10-3.8 13.8 0zm162-22.9l-48.8-48.8c-15.2-15.2-39.9-15.2-55.2 0l-35.4 35.4c-3.8 3.8-3.8 10 0 13.8l90.2 90.2c3.8 3.8 10 3.8 13.8 0l35.4-35.4c15.2-15.3 15.2-40 0-55.2zM384 346.2V448H64V128h229.8c3.2 0 6.2-1.3 8.5-3.5l40-40c7.6-7.6 2.2-20.5-8.5-20.5H48C21.5 64 0 85.5 0 112v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V306.2c0-10.7-12.9-16-20.5-8.5l-40 40c-2.2 2.3-3.5 5.3-3.5 8.5z"
+    />
+  </svg>
+)

src/icons/QrCode.js

@@ -0,0 +1,10 @@
+import React from 'react'
+
+export default props => (
+  <svg viewBox="0 0 448 512" {...props}>
+    <path
+      fill="currentColor"
+      d="M0 224h192V32H0v192zM64 96h64v64H64V96zm192-64v192h192V32H256zm128 128h-64V96h64v64zM0 480h192V288H0v192zm64-128h64v64H64v-64zm352-64h32v128h-96v-32h-32v96h-64V288h96v32h64v-32zm0 160h32v32h-32v-32zm-64 0h32v32h-32v-32z"
+    />
+  </svg>
+)

src/styles/global.js

@@ -4,10 +4,6 @@
 
 import { injectGlobal } from 'styled-components'
 
-import '@fortawesome/fontawesome-free-solid'
-import '@fortawesome/fontawesome-free-regular'
-import '@fortawesome/fontawesome-free-brands'
-
 import { fontFace } from 'styles/helpers'
 import { radii, colors } from 'styles/theme'
 import reset from './reset'

webpack/internals.config.js

@@ -38,5 +38,5 @@ module.exports = webpackMain().then(config => ({
 
   module: config.module,
 
-  plugins: [...plugins, ...config.plugins],
+  plugins: [...plugins('internals'), ...config.plugins],
 }))

webpack/main.config.js

@@ -1,7 +1,7 @@
 const plugins = require('./plugins')
 
 const config = {
-  plugins,
+  plugins: plugins('main'),
 }
 
 module.exports = config

webpack/plugins.js

@@ -1,12 +1,29 @@
 const webpack = require('webpack')
+const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer')
 
 require('../src/globals')
 
-module.exports = [
+const { BUNDLE_ANALYZER } = process.env
-  new webpack.DefinePlugin({
+
-    __GLOBAL_STYLES__: JSON.stringify(__GLOBAL_STYLES__),
+module.exports = type => {
-    __DEV__,
+  const plugins = [
-    __PROD__,
+    new webpack.DefinePlugin({
-    'process.env.NODE_ENV': JSON.stringify(__ENV__),
+      __GLOBAL_STYLES__: JSON.stringify(__GLOBAL_STYLES__),
-  }),
+      __DEV__,
-]
+      __PROD__,
+      'process.env.NODE_ENV': JSON.stringify(__ENV__),
+    }),
+  ]
+
+  if (BUNDLE_ANALYZER) {
+    plugins.push(
+      new BundleAnalyzerPlugin({
+        analyzerMode: 'static',
+        openAnalyzer: false,
+        reportFilename: `../report-${type}.html`,
+      }),
+    )
+  }
+
+  return plugins
+}

webpack/renderer.config.js

@@ -3,7 +3,7 @@ const HardSourceWebpackPlugin = require('hard-source-webpack-plugin')
 const plugins = require('./plugins')
 
 const config = {
-  plugins: [...plugins, new HardSourceWebpackPlugin()],
+  plugins: [...plugins('renderer'), new HardSourceWebpackPlugin()],
   devServer: {
     historyApiFallback: true,
   },

yarn.lock

@@ -116,40 +116,6 @@
     lodash "^4.2.0"
     to-fast-properties "^2.0.0"
 
-"@fortawesome/fontawesome-common-types@^0.1.3":
-  version "0.1.3"
-  resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-0.1.3.tgz#8475e0f2d1ad1f858c4ec2e76ed9a2456a09ad83"
-
-"@fortawesome/fontawesome-free-brands@^5.0.7":
-  version "5.0.8"
-  resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-free-brands/-/fontawesome-free-brands-5.0.8.tgz#dd234982bd958b48ab1108570831d2b41bc8f73b"
-  dependencies:
-    "@fortawesome/fontawesome-common-types" "^0.1.3"
-
-"@fortawesome/fontawesome-free-regular@^5.0.7":
-  version "5.0.8"
-  resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-free-regular/-/fontawesome-free-regular-5.0.8.tgz#feaa96ee230e7f0d685ede3ae512aa6a1dca2480"
-  dependencies:
-    "@fortawesome/fontawesome-common-types" "^0.1.3"
-
-"@fortawesome/fontawesome-free-solid@^5.0.7":
-  version "5.0.8"
-  resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-free-solid/-/fontawesome-free-solid-5.0.8.tgz#2890639d57dc16e2a90bb847c41770e38f72e432"
-  dependencies:
-    "@fortawesome/fontawesome-common-types" "^0.1.3"
-
-"@fortawesome/fontawesome@^1.1.4":
-  version "1.1.4"
-  resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome/-/fontawesome-1.1.4.tgz#03065638046206c2226e103b550196934c75be9b"
-  dependencies:
-    "@fortawesome/fontawesome-common-types" "^0.1.3"
-
-"@fortawesome/react-fontawesome@^0.0.17":
-  version "0.0.17"
-  resolved "https://registry.yarnpkg.com/@fortawesome/react-fontawesome/-/react-fontawesome-0.0.17.tgz#69abd135523187044f533cadc5458f829d43961f"
-  dependencies:
-    humps "^2.0.1"
-
 "@ledgerhq/currencies@^4.5.0":
   version "4.5.0"
   resolved "https://registry.yarnpkg.com/@ledgerhq/currencies/-/currencies-4.5.0.tgz#b54650049be6e2452e3b9f869edd6ea5deb45169"
@@ -1924,6 +1890,14 @@ bech32@^1.1.2:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/bech32/-/bech32-1.1.3.tgz#bd47a8986bbb3eec34a56a097a84b8d3e9a2dfcd"
 
+bfj-node4@^5.2.0:
+  version "5.2.1"
+  resolved "https://registry.yarnpkg.com/bfj-node4/-/bfj-node4-5.2.1.tgz#3a6aa2730cf6911ba2afb836c2f88f015d718f3f"
+  dependencies:
+    bluebird "^3.5.1"
+    check-types "^7.3.0"
+    tryer "^1.0.0"
+
 big.js@^3.1.3:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/big.js/-/big.js-3.2.0.tgz#a5fc298b81b9e0dca2e458824784b65c52ba588e"
@@ -2475,6 +2449,10 @@ charenc@~0.0.1:
   version "0.0.2"
   resolved "https://registry.yarnpkg.com/charenc/-/charenc-0.0.2.tgz#c0a1d2f3a7092e03774bfa83f14c0fc5790a8667"
 
+check-types@^7.3.0:
+  version "7.3.0"
+  resolved "https://registry.yarnpkg.com/check-types/-/check-types-7.3.0.tgz#468f571a4435c24248f5fd0cb0e8d87c3c341e7d"
+
 chokidar@^2.0.0, chokidar@^2.0.2:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-2.0.2.tgz#4dc65139eeb2714977735b6a35d06e97b494dfd7"
@@ -2693,6 +2671,10 @@ commander@2.6.0:
   version "2.6.0"
   resolved "https://registry.yarnpkg.com/commander/-/commander-2.6.0.tgz#9df7e52fb2a0cb0fb89058ee80c3104225f37e1d"
 
+commander@^2.13.0:
+  version "2.15.0"
+  resolved "https://registry.yarnpkg.com/commander/-/commander-2.15.0.tgz#ad2a23a1c3b036e392469b8012cec6b33b4c1322"
+
 commander@~2.13.0:
   version "2.13.0"
   resolved "https://registry.yarnpkg.com/commander/-/commander-2.13.0.tgz#6964bca67685df7c1f1430c584f07d7597885b9c"
@@ -3506,6 +3488,10 @@ duplexer3@^0.1.4:
   version "0.1.4"
   resolved "https://registry.yarnpkg.com/duplexer3/-/duplexer3-0.1.4.tgz#ee01dd1cac0ed3cbc7fdbea37dc0a8f1ce002ce2"
 
+duplexer@^0.1.1:
+  version "0.1.1"
+  resolved "https://registry.yarnpkg.com/duplexer/-/duplexer-0.1.1.tgz#ace6ff808c1ce66b57d1ebf97977acb02334cfc1"
+
 duplexify@^3.4.2, duplexify@^3.5.3:
   version "3.5.4"
   resolved "https://registry.yarnpkg.com/duplexify/-/duplexify-3.5.4.tgz#4bb46c1796eabebeec4ca9a2e66b808cb7a3d8b4"
@@ -4441,6 +4427,10 @@ fileset@^2.0.2:
     glob "^7.0.3"
     minimatch "^3.0.3"
 
+filesize@^3.5.11:
+  version "3.6.0"
+  resolved "https://registry.yarnpkg.com/filesize/-/filesize-3.6.0.tgz#22d079615624bb6fd3c04026120628a41b3f4efa"
+
 fill-range@^2.1.0:
   version "2.2.3"
   resolved "https://registry.yarnpkg.com/fill-range/-/fill-range-2.2.3.tgz#50b77dfd7e469bc7492470963699fe7a8485a723"
@@ -4913,6 +4903,13 @@ growly@^1.3.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/growly/-/growly-1.3.0.tgz#f10748cbe76af964b7c96c93c6bcc28af120c081"
 
+gzip-size@^4.1.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/gzip-size/-/gzip-size-4.1.0.tgz#8ae096257eabe7d69c45be2b67c448124ffb517c"
+  dependencies:
+    duplexer "^0.1.1"
+    pify "^3.0.0"
+
 handle-thing@^1.2.5:
   version "1.2.5"
   resolved "https://registry.yarnpkg.com/handle-thing/-/handle-thing-1.2.5.tgz#fd7aad726bf1a5fd16dfc29b2f7a6601d27139c4"
@@ -5261,10 +5258,6 @@ https-browserify@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/https-browserify/-/https-browserify-1.0.0.tgz#ec06c10e0a34c0f2faf199f7fd7fc78fffd03c73"
 
-humps@^2.0.1:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/humps/-/humps-2.0.1.tgz#dd02ea6081bd0568dc5d073184463957ba9ef9aa"
-
 husky@^0.14.3:
   version "0.14.3"
   resolved "https://registry.yarnpkg.com/husky/-/husky-0.14.3.tgz#c69ed74e2d2779769a17ba8399b54ce0b63c12c3"
@@ -7319,6 +7312,10 @@ opencollective@^1.0.3:
     node-fetch "1.6.3"
     opn "4.0.2"
 
+opener@^1.4.3:
+  version "1.4.3"
+  resolved "https://registry.yarnpkg.com/opener/-/opener-1.4.3.tgz#5c6da2c5d7e5831e8ffa3964950f8d6674ac90b8"
+
 opn@4.0.2:
   version "4.0.2"
   resolved "https://registry.yarnpkg.com/opn/-/opn-4.0.2.tgz#7abc22e644dff63b0a96d5ab7f2790c0f01abc95"
@@ -9994,6 +9991,10 @@ truncate-utf8-bytes@^1.0.0:
   dependencies:
     utf8-byte-length "^1.0.1"
 
+tryer@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/tryer/-/tryer-1.0.0.tgz#027b69fa823225e551cace3ef03b11f6ab37c1d7"
+
 tslib@^1.7.1:
   version "1.9.0"
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.9.0.tgz#e37a86fda8cbbaf23a057f473c9f4dc64e5fc2e8"
@@ -10412,6 +10413,23 @@ webidl-conversions@^4.0.1, webidl-conversions@^4.0.2:
   version "4.0.2"
   resolved "https://registry.yarnpkg.com/webidl-conversions/-/webidl-conversions-4.0.2.tgz#a855980b1f0b6b359ba1d5d9fb39ae941faa63ad"
 
+webpack-bundle-analyzer@^2.11.1:
+  version "2.11.1"
+  resolved "https://registry.yarnpkg.com/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.11.1.tgz#b9fbfb6a32c0a8c1c3237223e90890796b950ab9"
+  dependencies:
+    acorn "^5.3.0"
+    bfj-node4 "^5.2.0"
+    chalk "^2.3.0"
+    commander "^2.13.0"
+    ejs "^2.5.7"
+    express "^4.16.2"
+    filesize "^3.5.11"
+    gzip-size "^4.1.0"
+    lodash "^4.17.4"
+    mkdirp "^0.5.1"
+    opener "^1.4.3"
+    ws "^4.0.0"
+
 webpack-core@~0.6.0:
   version "0.6.9"
   resolved "https://registry.yarnpkg.com/webpack-core/-/webpack-core-0.6.9.tgz#fc571588c8558da77be9efb6debdc5a3b172bdc2"