v0.13.0 (#1166)

* Check if PORT in use before starting dev env * Used electron-rebuild to compile ./app/package.json dependencies * Added css minification in production * Fixed CheckPortInUse functionality * Reduced webpack dll boilerplate, migrated to EnvPlugin * Added electron-rebuild script to both package.json's * Updated editorconfig, fixed publicPath in webpack renderer prod config * [ci skip] Removed extraneous name prefix from dev expr babel plugin * Swapped babili for uglifyjs, re-enabled multiStep webpack HMR * Reduced and refactored docs * Removed CI check, fixed font paths in css files * Removed explicit electron version flag from electron-rebuild * Added source map support for uglify * Fix sourceMap config in main process * Properly parallelized electron-rebuild * Fixed all flow definitions * Updated react to 16 * Check and warn the user if there are native deps installed in root folder (#1246) * Implemented native deps checker * Modified postinstall script to run native dep check * Code cleanup * Updated formatting * Bumped deps * 'CheckNativeDep' script enhancements (#1327) * CheckNativeDep enhancements * Enhanced output * Require sudo in travis * CI Fixes (#1329) * Temporarily remove concurrently from postinstall script * Fixed cylical dependency between webpack dev renderer configs * Removed conflicting dependencies * Removed eslint-plugin-flowtype-errors * Fixed all eslint errors, bumped deps * Fixed linux category * Bumped deps * Fixed ordering of CheckNativeDep script, improved error message
forclan · Jan 6, 2018 · 177b3a3 · 177b3a3
1 parent 3788bcb
commit 177b3a3
Show file tree

Hide file tree

Showing 31 changed files with 4,591 additions and 3,489 deletions.
diff --git a/.babelrc b/.babelrc
@@ -11,7 +11,7 @@
   "env": {
     "production": {
       "presets": ["react-optimize"],
-      "plugins": ["babel-plugin-dev-expression"]
+      "plugins": ["dev-expression"]
     },
     "development": {
       "plugins": [

diff --git a/.dockerignore b/.dockerignore
@@ -0,0 +1,53 @@
+# Logs
+logs
+*.log
+
+# Runtime data
+pids
+*.pid
+*.seed
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+
+# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (http://nodejs.org/api/addons.html)
+build/Release
+.eslintcache
+
+# Dependency directory
+# https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git
+node_modules
+app/node_modules
+
+# OSX
+.DS_Store
+
+# flow-typed
+flow-typed/npm/*
+!flow-typed/npm/module_vx.x.x.js
+
+# App packaged
+release
+app/main.prod.js
+app/main.prod.js.map
+app/renderer.prod.js
+app/renderer.prod.js.map
+app/style.css
+app/style.css.map
+dist
+dll
+main.js
+main.js.map
+
+.idea
+npm-debug.log.*
+.*.dockerfile
diff --git a/.editorconfig b/.editorconfig
@@ -8,13 +8,5 @@ charset = utf-8
 trim_trailing_whitespace = true
 insert_final_newline = true
 
-[*.{json,js,jsx,html,css,yml}]
-indent_style = space
-indent_size = 2
-
-[.eslintrc]
-indent_style = space
-indent_size = 2
-
 [*.md]
 trim_trailing_whitespace = false
diff --git a/.eslintrc b/.eslintrc
@@ -14,10 +14,10 @@
     "compat/compat": "error",
     "consistent-return": "off",
     "comma-dangle": "off",
-    "flowtype-errors/show-errors": "error",
     "generator-star-spacing": "off",
     "import/no-unresolved": "error",
     "import/no-extraneous-dependencies": "off",
+    "jsx-a11y/anchor-is-valid": "off",
     "no-console": "off",
     "no-use-before-define": "off",
     "no-multi-assign": "off",
@@ -34,7 +34,6 @@
   },
   "plugins": [
     "flowtype",
-    "flowtype-errors",
     "import",
     "promise",
     "compat",

diff --git a/.gitattributes b/.gitattributes
@@ -1,4 +1,6 @@
 * text eol=lf
 *.png binary
+*.jpg binary
+*.jpeg binary
 *.ico binary
 *.icns binary
diff --git a/.travis.yml b/.travis.yml
@@ -1,4 +1,4 @@
-sudo: false
+sudo: true
 
 language: node_js
 

diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,9 @@
+# 0.13.0 (2018.1.6)
+
+#### Additions
+- Add native dependencies check on postinstall
+- Updated all dependencies to latest semver
+
 # 0.12.0 (2017.7.8)
 
 #### Misc

diff --git a/README.md b/README.md
@@ -44,11 +44,11 @@ And then install dependencies with yarn.
 $ cd your-project-name
 $ yarn
 ```
-**Note**: If you can't use [yarn](https://github.com/yarnpkg/yarn) for some reason, try `npm install`.
+**Note**: If you can't use [yarn](https://github.com/yarnpkg/yarn), run `npm install`.
 
 ## Run
 
-Start the app in the `dev` environment. This starts the renderer process in [**hot-module-replacement**](https://webpack.js.org/guides/hmr-react/) mode and starts a server that sends hot updates to the renderer process:
+Start the app in the `dev` environment. This starts the renderer process in [**hot-module-replacement**](https://webpack.js.org/guides/hmr-react/) mode and starts a webpack dev server that sends hot updates to the renderer process:
 
 ```bash
 $ npm run dev
@@ -61,93 +61,6 @@ $ npm run start-renderer-dev
 $ npm run start-main-dev
 ```
 
-## Editor Configuration
-**Atom**
-```bash
-apm install editorconfig es6-javascript atom-ternjs javascript-snippets linter linter-eslint language-babel autocomplete-modules file-icons
-```
-
-**VSCode**
-* [Editorconfig](https://github.com/editorconfig/editorconfig-vscode)
-* [ESLint](https://github.com/Microsoft/vscode-eslint)
-* [Flow](https://github.com/flowtype/flow-for-vscode)
-* [Babel](https://github.com/dzannotti/vscode-babel)
-* [Jest](https://github.com/orta/vscode-jest)
-* [ES6 Snippets](https://marketplace.visualstudio.com/items?itemName=xabikos.JavaScriptSnippets)
-* [React Snippets](https://marketplace.visualstudio.com/items?itemName=xabikos.ReactSnippets)
-:bulb: *If you are using the `flow-for-vscode` plugin, make sure to disable the `flowtype-errors/show-errors` eslint rule in the `.eslintrc` by setting it to `0`*
-
-**Sublime**
-* [Editorconfig Integration](https://github.com/sindresorhus/editorconfig-sublime#readme)
-* [Linting](https://github.com/SublimeLinter/SublimeLinter3)
-* [ESLint Integration](https://github.com/roadhump/SublimeLinter-eslint)
-* [Syntax Highlighting](https://github.com/babel/babel-sublime)
-* [Autocompletion](https://github.com/ternjs/tern_for_sublime)
-* [Node Snippets](https://packagecontrol.io/packages/JavaScript%20%26%20NodeJS%20Snippets)
-* [ES6 Snippets](https://packagecontrol.io/packages/ES6-Toolkit)
-
-**Others**
-* [Editorconfig](http://editorconfig.org/#download)
-* [ESLint](http://eslint.org/docs/user-guide/integrations#editors)
-* Babel Syntax Plugin
-
-## DevTools
-
-#### Toggle Chrome DevTools
-
-- OS X: <kbd>Cmd</kbd> <kbd>Alt</kbd> <kbd>I</kbd> or <kbd>F12</kbd>
-- Linux: <kbd>Ctrl</kbd> <kbd>Shift</kbd> <kbd>I</kbd> or <kbd>F12</kbd>
-- Windows: <kbd>Ctrl</kbd> <kbd>Shift</kbd> <kbd>I</kbd> or <kbd>F12</kbd>
-
-*See [electron-debug](https://github.com/sindresorhus/electron-debug) for more information.*
-
-#### DevTools extension
-
-This boilerplate includes the following DevTools extensions:
-
-* [Devtron](https://github.com/electron/devtron) - Install via [electron-debug](https://github.com/sindresorhus/electron-debug).
-* [React Developer Tools](https://github.com/facebook/react-devtools) - Install via [electron-devtools-installer](https://github.com/GPMDP/electron-devtools-installer).
-* [Redux DevTools](https://github.com/zalmoxisus/redux-devtools-extension) - Install via [electron-devtools-installer](https://github.com/GPMDP/electron-devtools-installer).
-
-You can find the tabs on Chrome DevTools.
-
-If you want to update extensions version, please set `UPGRADE_EXTENSIONS` env, just run:
-
-```bash
-$ UPGRADE_EXTENSIONS=1 npm run dev
-
-# For Windows
-$ set UPGRADE_EXTENSIONS=1 && npm run dev
-```
-
-:bulb: You can debug your production build with devtools by simply setting the `DEBUG_PROD` env variable:
-```
-DEBUG_PROD=true npm run package
-```
-
-
-## CSS Modules
-
-This boilerplate is configured to use [css-modules](https://github.com/css-modules/css-modules) out of the box.
-
-All `.css` file extensions will use css-modules unless it has `.global.css`.
-
-If you need global styles, stylesheets with `.global.css` will not go through the
-css-modules loader. e.g. `app.global.css`
-
-If you want to import global css libraries (like `bootstrap`), you can just write the following code in `.global.css`:
-
-```css
-@import "~bootstrap/dist/css/bootstrap.css";
-```
-
-## Sass support
-
-If you want to use Sass in your app, you only need to import `.sass` files instead of `.css` once:
-```js
-import './app.global.scss';
-```
-
 ## Packaging
 
 To package apps for the local platform:
@@ -171,25 +84,17 @@ To package apps with options:
 $ npm run package -- --[option]
 ```
 
-## Further commands
-
-To run the application without packaging run
-
-```bash
-$ npm run build
-$ npm start
-```
-
 To run End-to-End Test
 
 ```bash
 $ npm run build
 $ npm run test-e2e
 ```
 
-#### Options
-
-See [electron-builder CLI Usage](https://github.com/electron-userland/electron-builder#cli-usage)
+:bulb: You can debug your production build with devtools by simply setting the `DEBUG_PROD` env variable:
+```bash
+DEBUG_PROD=true npm run package
+```
 
 ## How to add modules to the project
 
@@ -219,18 +124,36 @@ See the wiki page, [Module Structure — Two package.json Structure](https:/
 
 For an example app that uses this boilerplate and packages native dependencies, see [erb-sqlite-example](https://github.com/amilajack/erb-sqlite-example).
 
-## Static Type Checking
-This project comes with Flow support out of the box! You can annotate your code with types, [get Flow errors as ESLint errors](https://github.com/amilajack/eslint-plugin-flowtype-errors), and get [type errors during runtime](https://github.com/codemix/flow-runtime) during development. Types are completely optional.
+## CSS Modules
 
-## Native-like UI
+This boilerplate is configured to use [css-modules](https://github.com/css-modules/css-modules) out of the box.
 
-If you want to have native-like User Interface (OS X El Capitan and Windows 10), [react-desktop](https://github.com/gabrielbull/react-desktop) may perfect suit for you.
+All `.css` file extensions will use css-modules unless it has `.global.css`.
+
+If you need global styles, stylesheets with `.global.css` will not go through the
+css-modules loader. e.g. `app.global.css`
+
+If you want to import global css libraries (like `bootstrap`), you can just write the following code in `.global.css`:
+
+```css
+@import "~bootstrap/dist/css/bootstrap.css";
+```
+
+## Sass support
+
+If you want to use Sass in your app, you only need to import `.sass` files instead of `.css` once:
+```js
+import './app.global.scss';
+```
+
+## Static Type Checking
+This project comes with Flow support out of the box! You can annotate your code with types, [get Flow errors as ESLint errors](https://github.com/amilajack/eslint-plugin-flowtype-errors), and get [type errors during runtime](https://github.com/codemix/flow-runtime) during development. Types are completely optional.
 
 ## Dispatching redux actions from main process
 
-see discusses in [#118](https://github.com/chentsulin/electron-react-boilerplate/issues/118) and [#108](https://github.com/chentsulin/electron-react-boilerplate/issues/108)
+See [#118](https://github.com/chentsulin/electron-react-boilerplate/issues/118) and [#108](https://github.com/chentsulin/electron-react-boilerplate/issues/108)
 
-## How to keep the boilerplate updated
+## How to keep your project updated with the boilerplate
 
 If your application is a fork from this repo, you can add this repo to another git remote:
 

diff --git a/app/.eslintrc b/app/.eslintrc
@@ -1,22 +1,21 @@
 {
   "rules": {
-    "flowtype/boolean-style": [2, "boolean"],
-    "flowtype/define-flow-type": 1,
-    "flowtype/delimiter-dangle": [2, "never"],
-    "flowtype/generic-spacing": [2, "never"],
-    "flowtype/no-primitive-constructor-types": 2,
-    "flowtype/no-weak-types": 1,
-    "flowtype/object-type-delimiter": [2, "comma"],
-    "flowtype/require-parameter-type": 0,
-    "flowtype/require-return-type": 0,
-    "flowtype/require-valid-file-annotation": 0,
-    "flowtype/semi": [2, "always"],
-    "flowtype/space-after-type-colon": [2, "always"],
-    "flowtype/space-before-generic-bracket": [2, "never"],
-    "flowtype/space-before-type-colon": [2, "never"],
-    "flowtype/union-intersection-spacing": [2, "always"],
-    "flowtype/use-flow-type": 2,
-    "flowtype/valid-syntax": 2,
-    "flowtype-errors/show-errors": 2
+    "flowtype/boolean-style": ["error", "boolean"],
+    "flowtype/define-flow-type": "warn",
+    "flowtype/delimiter-dangle": ["error", "never"],
+    "flowtype/generic-spacing": ["error", "never"],
+    "flowtype/no-primitive-constructor-types": "error",
+    "flowtype/no-weak-types": "warn",
+    "flowtype/object-type-delimiter": ["error", "comma"],
+    "flowtype/require-parameter-type": "off",
+    "flowtype/require-return-type": "off",
+    "flowtype/require-valid-file-annotation": "off",
+    "flowtype/semi": ["error", "always"],
+    "flowtype/space-after-type-colon": ["error", "always"],
+    "flowtype/space-before-generic-bracket": ["error", "never"],
+    "flowtype/space-before-type-colon": ["error", "never"],
+    "flowtype/union-intersection-spacing": ["error", "always"],
+    "flowtype/use-flow-type": "error",
+    "flowtype/valid-syntax": "error"
   }
 }
diff --git a/app/app.global.css b/app/app.global.css
@@ -1,3 +1,7 @@
+/*
+ * @NOTE: Prepend a `~` to css file paths that are in your node_modules
+ *        See https://github.com/webpack-contrib/sass-loader#imports
+ */
 @import "~font-awesome/css/font-awesome.css";
 
 body {

diff --git a/app/components/Counter.js b/app/components/Counter.js
@@ -3,17 +3,21 @@ import React, { Component } from 'react';
 import { Link } from 'react-router-dom';
 import styles from './Counter.css';
 
-class Counter extends Component {
-  props: {
-    increment: () => void,
-    incrementIfOdd: () => void,
-    incrementAsync: () => void,
-    decrement: () => void,
-    counter: number
-  };
+type Props = {
+  increment: () => void,
+  incrementIfOdd: () => void,
+  incrementAsync: () => void,
+  decrement: () => void,
+  counter: number
+};
+
+class Counter extends Component<Props> {
+  props: Props;
 
   render() {
-    const { increment, incrementIfOdd, incrementAsync, decrement, counter } = this.props;
+    const {
+      increment, incrementIfOdd, incrementAsync, decrement, counter
+    } = this.props;
     return (
       <div>
         <div className={styles.backButton} data-tid="backButton">

diff --git a/app/components/Home.js b/app/components/Home.js
@@ -3,7 +3,11 @@ import React, { Component } from 'react';
 import { Link } from 'react-router-dom';
 import styles from './Home.css';
 
-export default class Home extends Component {
+type Props = {};
+
+export default class Home extends Component<Props> {
+  props: Props;
+
   render() {
     return (
       <div>