Release 0.11.0 (#921)

* [WIP] Route-based code splitting (#884)

* Upgrading to React Router v4, using react-router-redux@next

Refactoring routes.js to use Switch

store now export history

renamed router reducer

switch to react-router-dom

* Adding code-splitting at route level

* Fix flow warnings

* Fix Typo during eslint no-shadow fix

* More flow fixes...

* Even more Flow checking

* Switching to babel preset dynamic import webpack

* Fixing CounterPage spec

* Route-based code splitting

* Updated all deps

* Updated flow types

* Fix npm start and npm run dev (#901)

* should fix npm start and npm run dev

* change back to warn about the global requires

* makes flow happy

* flow again use Children, passes npm run lint locally

* flow again use any so we only get a warning

* flow disable children

* Updated deps

* Cleaned up code style, removed unnecessary eslint supressions

* Removed flow children disabled line

* Added HtmlWebpackPlugin (#916)

* Fixed HMR (disabled multiStep) (#920)

* Fixed HMR

* Commented multiPass instead of removing

* Updated CHANGELOG (#923)

* Updated changelog

* Added more notable changes [ci skip]

* Added support for Webpack Bundle Analyzer (#922)

* Added webpack bundle analyzer to CHANGELOG [ci skip]

* Bump package.json version [ci skip]

* Bump flow-bin [ci skip]

* Fixed hot-reload refresh url

* Bumped electron

* Added Initial Jest Snapshot Testing Support (#928)

* Updated CHANGELOG date [ci skip]

s

.babelrc

@@ -7,7 +7,7 @@
     "stage-0",
     "react"
   ],
-  "plugins": ["add-module-exports"],
+  "plugins": ["add-module-exports", "dynamic-import-webpack"],
   "env": {
     "production": {
       "presets": ["react-optimize"],

.eslintignore

@@ -3,3 +3,4 @@ app/dist/
 app/main.js
 node_modules
 dll
+__snapshots__

.eslintrc

@@ -1,5 +1,9 @@
 {
   "parser": "babel-eslint",
+  "parserOptions": {
+    "sourceType": "module",
+    "allowImportExportEverywhere": true
+  },
   "extends": "airbnb",
   "env": {
     "browser": true,

.gitignore

@@ -50,3 +50,4 @@ main.js.map
 
 .idea
 npm-debug.log.*
+__snapshots__

.vscode/settings.json

@@ -4,6 +4,7 @@
     ".git": true,
     "node_modules": true,
     "flow-typed": true,
+    "__snapshots__": true,
     "bower_components": true
   }
 }

CHANGELOG.md

@@ -1,3 +1,43 @@
+# 0.11.0 (2017.4.19)
+
+Here's the most notable changes since `v0.10.0`. Its been about a year since a release has been pushed. Expect a new release to be published every 3-4 weeks.
+
+#### Breaking Changes
+
+- **Dropped support for node < 6**
+- **Refactored webpack config files**
+- **Migrate to two-package.json project structure**
+- **Updated all devDeps to latest semver**
+- **Migrated to Jest:** [#768](https://github.com/chentsulin/electron-react-boilerplate/pull/768)
+- **Migrated to `react-router@4`**
+- **Migrated to `electron-builder@4`**
+- **Migrated to `webpack@2`**
+- **Migrated to `react-hot-loader@3`**
+- **Changed default live reload server PORT to `1212` from `3000`**
+
+#### Additions
+
+- **Added support for Yarn:** [#451](https://github.com/chentsulin/electron-react-boilerplate/pull/451)
+- **Added support for Flow:** [#425](https://github.com/chentsulin/electron-react-boilerplate/pull/425)
+- **Added support for stylelint:** [#911](https://github.com/chentsulin/electron-react-boilerplate/pull/911)
+- **Added support for electron-builder:** [#876](https://github.com/chentsulin/electron-react-boilerplate/pull/876)
+- **Added optional support for SASS:** [#880](https://github.com/chentsulin/electron-react-boilerplate/pull/880)
+- **Added support for eslint-plugin-flowtype:** [#911](https://github.com/chentsulin/electron-react-boilerplate/pull/911)
+- **Added support for appveyor:** [#280](https://github.com/chentsulin/electron-react-boilerplate/pull/280)
+- **Added support for webpack dlls:** [#860](https://github.com/chentsulin/electron-react-boilerplate/pull/860)
+- **Route based code splitting:** [#884](https://github.com/chentsulin/electron-react-boilerplate/pull/884)
+- **Added support for Webpack Bundle Analyzer:** [#922](https://github.com/chentsulin/electron-react-boilerplate/pull/922)
+
+#### Improvements
+
+- **Parallelize renderer and main build processes when running `npm run build`**
+- **Dynamically generate electron app menu**
+- **Improved vscode integration:** [#856](https://github.com/chentsulin/electron-react-boilerplate/pull/856)
+
+#### Bug Fixes
+
+- **Fixed hot module replacement race condition bug:** [#917](https://github.com/chentsulin/electron-react-boilerplate/pull/917) [#920](https://github.com/chentsulin/electron-react-boilerplate/pull/920)
+
 # 0.10.0 (2016.4.18)
 
 #### Improvements

app/app.html

@@ -3,41 +3,11 @@
   <head>
     <meta charset="utf-8">
     <title>Hello Electron React!</title>
-    <script>
-      (() => {
-        if (!process.env.HOT) {
-          const link = document.createElement('link');
-          link.rel = 'stylesheet';
-          link.href = './dist/style.css';
-          // HACK: Writing the script path should be done with webpack
-          document.getElementsByTagName('head')[0].appendChild(link);
-        }
-      })();
-    </script>
   </head>
   <body>
     <div id="root"></div>
-    <script>
-      {
-        // Dynamically include DLL if in development
-        if (process.env.NODE_ENV === 'development') {
-          const dllScript = document.createElement('script');
-          dllScript.src = '../dll/vendor.dll.js';
-          document.body.appendChild(dllScript);
-        }
-
-        // Dynamically insert the renderer process
-        const script = document.createElement('script');
-        const port = process.env.PORT || 1212;
-
-        script.src = (process.env.HOT)
-          ? 'http://localhost:' + port + '/dist/bundle.js'
-          : './dist/bundle.js';
-
-        // @HACK: Writing the script path should be done
-        //        with HtmlWebpackPlugin
-        document.body.appendChild(script);
-      }
-    </script>
+    <% if (htmlWebpackPlugin.options.dll) { %>
+    <script src="<%= htmlWebpackPlugin.options.dll %>"></script>
+    <% } %>
   </body>
 </html>

app/components/Counter.js

@@ -1,6 +1,6 @@
 // @flow
 import React, { Component } from 'react';
-import { Link } from 'react-router';
+import { Link } from 'react-router-dom';
 import styles from './Counter.css';
 
 class Counter extends Component {

app/components/Home.js

@@ -1,9 +1,8 @@
 // @flow
 import React, { Component } from 'react';
-import { Link } from 'react-router';
+import { Link } from 'react-router-dom';
 import styles from './Home.css';
 
-
 export default class Home extends Component {
   render() {
     return (

app/containers/Root.js

@@ -1,8 +1,8 @@
 // @flow
 import React from 'react';
 import { Provider } from 'react-redux';
-import { Router } from 'react-router';
-import routes from '../routes';
+import { ConnectedRouter } from 'react-router-redux';
+import Routes from '../routes';
 
 type RootType = {
   store: {},
@@ -12,7 +12,9 @@ type RootType = {
 export default function Root({ store, history }: RootType) {
   return (
     <Provider store={store}>
-      <Router key={Math.random()} history={history} routes={routes} />
+      <ConnectedRouter history={history}>
+        <Routes />
+      </ConnectedRouter>
     </Provider>
   );
 }

app/index.js

@@ -1,14 +1,11 @@
 import React from 'react';
 import { render } from 'react-dom';
-import { hashHistory } from 'react-router';
 import { AppContainer } from 'react-hot-loader';
-import { syncHistoryWithStore } from 'react-router-redux';
 import Root from './containers/Root';
-import configureStore from './store/configureStore';
+import { configureStore, history } from './store/configureStore';
 import './app.global.css';
 
 const store = configureStore();
-const history = syncHistoryWithStore(hashHistory, store);
 
 render(
   <AppContainer>

app/main.development.js

@@ -51,7 +51,10 @@ app.on('ready', async () => {
     height: 728
   });
 
-  mainWindow.loadURL(`file://${__dirname}/app.html`);
+  const url = (process.env.NODE_ENV === 'development')
+    ? `http://localhost:${process.env.PORT || 1212}/dist/app.html`
+    : `file://${__dirname}/dist/app.html`;
+  mainWindow.loadURL(url);
 
   // @TODO: Use 'ready-to-show' event
   //        https://github.com/electron/electron/blob/master/docs/api/browser-window.md#using-ready-to-show-event

app/reducers/index.js

@@ -1,11 +1,11 @@
 // @flow
 import { combineReducers } from 'redux';
-import { routerReducer as routing } from 'react-router-redux';
+import { routerReducer as router } from 'react-router-redux';
 import counter from './counter';
 
 const rootReducer = combineReducers({
   counter,
-  routing
+  router,
 });
 
 export default rootReducer;

app/routes.js

@@ -1,14 +1,18 @@
-// @flow
+/* eslint flowtype-errors/show-errors: 0 */
 import React from 'react';
-import { Route, IndexRoute } from 'react-router';
+import { BrowserRouter as Router } from 'react-router-dom';
+import { Switch, Route } from 'react-router';
 import App from './containers/App';
 import HomePage from './containers/HomePage';
 import CounterPage from './containers/CounterPage';
 
-
-export default (
-  <Route path="/" component={App}>
-    <IndexRoute component={HomePage} />
-    <Route path="/counter" component={CounterPage} />
-  </Route>
+export default () => (
+  <Router>
+    <App>
+      <Switch>
+        <Route path="/counter" component={CounterPage} />
+        <Route path="/" component={HomePage} />
+      </Switch>
+    </App>
+  </Router>
 );

app/store/configureStore.development.js

@@ -1,13 +1,16 @@
 import { createStore, applyMiddleware, compose } from 'redux';
 import thunk from 'redux-thunk';
-import { hashHistory } from 'react-router';
+import { hashHistory } from 'react-router-dom';
+import { createBrowserHistory } from 'history';
 import { routerMiddleware, push } from 'react-router-redux';
 import { createLogger } from 'redux-logger';
 import rootReducer from '../reducers';
 import * as counterActions from '../actions/counter';
 import type { counterStateType } from '../reducers/counter';
 
-export default (initialState: ?counterStateType) => {
+const history = createBrowserHistory();
+
+const configureStore = (initialState: ?counterStateType) => {
   // Redux Configuration
   const middleware = [];
   const enhancers = [];
@@ -56,3 +59,5 @@ export default (initialState: ?counterStateType) => {
 
   return store;
 };
+
+export default { configureStore, history };

app/store/configureStore.production.js

@@ -1,15 +1,17 @@
 // @flow
 import { createStore, applyMiddleware } from 'redux';
 import thunk from 'redux-thunk';
-import { hashHistory } from 'react-router';
+import { createBrowserHistory } from 'history';
 import { routerMiddleware } from 'react-router-redux';
 import rootReducer from '../reducers';
 import type { counterStateType } from '../reducers/counter';
 
-const router = routerMiddleware(hashHistory);
-
+const history = createBrowserHistory();
+const router = routerMiddleware(history);
 const enhancer = applyMiddleware(thunk, router);
 
-export default function configureStore(initialState?: counterStateType) {
+function configureStore(initialState?: counterStateType) {
   return createStore(rootReducer, initialState, enhancer);
 }
+
+export default { configureStore, history };