A Foundation for Scalable Cross-Platform Apps

Home Page: https://electron-react-boilerplate.js.org/

License: MIT License

JavaScript 15.34% CSS 2.67% TypeScript 81.31% EJS 0.68%

electron boilerplate react webpack babel eslint typescript javascript

electron-react-boilerplate's Introduction

Electron React Boilerplate uses Electron, React, React Router, Webpack and React Fast Refresh.

Install

Clone the repo and install dependencies:

git clone --depth 1 --branch main https://github.com/electron-react-boilerplate/electron-react-boilerplate.git your-project-name
cd your-project-name
npm install

Having issues installing? See our debugging guide

Starting Development

Start the app in the dev environment:

npm start

Packaging for Production

To package apps for the local platform:

npm run package

Docs

See our docs and guides here

Community

Join our Discord: https://discord.gg/Fjy3vfgy5q

Donations

Donations will ensure the following:

🔨 Long term maintenance of the project
🛣 Progress on the roadmap
🐛 Quick responses to bug reports and help requests

Backers

Support us with a monthly donation and help us continue our activities. [Become a backer]

Maintainers

License

MIT © Electron React Boilerplate

electron-react-boilerplate's People

Contributors

Stargazers

Watchers

Forkers

akovalyov ruifortes shakdwipeea tsemerad hobbesmedia leechsien nikhilbaradwaj danielbushman werm davegomez ctrlla dmccraw marciovicente rtorr kabbi joycebabu luwenjin oiledcode producters longlivechief awsp fudong1127 vzaccaria montlebalm ehesp brndn4 jwsonic ryanatvicesoftware chiralbehaviors jhen0409 cedarlogic catalinmiron aeikenberry danielgasperut jacob-faber cinderblock techpub wharsojo kevinrodbe williamholmes rd-alex-alex2006hw itproto marufsiddiqui noscripter pwmckenna minhthuanit ckmilse mr-justin xesrevinu ap13p vad3x artankarrica bradens laander qeekin inokcom alexhawkins jakeginnivan heyhey482 robmagary travisperson jeffbcross jonahglover fritx skapusniak weekwood pahund shea256 tinybug mcanthony datapimp hhkim wmeldon stepan-romankov vjo turtle89431 jimmed holmesworcester kevana rkazakov jbenesch kilian mobiletta pascalw jaketrent donorman geowarin slightlytyler morukutsu krankin mihai-chiorean epilande cipas cubedro kenyonj aert jgarcia241 marlonbernardes s3rious ivanjacobs

electron-react-boilerplate's Issues

request electron be in PATH instead of making mac-specific paths

Not everyone devs in a mac all the time; a fix is as simple as changing the package.json like so:

"start": "electron .",
"start-dev": "NODE_ENV=development electron .",
"start-hot": "HOT=1 NODE_ENV=development electron .",

After downloading and installing and running npm install I still have to manually install most dependencies

Here's my console output.

Last login: Wed Sep 23 05:46:39 on console
Ryans-MacBook-Air:~ ryanvice$ pwd
/Users/ryanvice
Ryans-MacBook-Air:~ ryanvice$ ls
Applications        Library         VirtualBox VMs
Desktop         Movies          npm-debug.log
Documents       Music           smartpicturecloud
Downloads       Pictures
Google Drive        Public
Ryans-MacBook-Air:~ ryanvice$ cd Documents/Code/Jones/
Ryans-MacBook-Air:Jones ryanvice$ ls
MarkLogic   MarkLogicReflux SOG
Ryans-MacBook-Air:Jones ryanvice$ cd SOG/
Ryans-MacBook-Air:SOG ryanvice$ ls
MagicButtonForm         SalesOrderCreator.sln
MagicButtonLibrary      SalesOrderGeneratorLibrary
README.md           UI
Ryans-MacBook-Air:SOG ryanvice$ cd UI
Ryans-MacBook-Air:UI ryanvice$ ls
Content         README.md       Views
Controllers     SOG.svc         Web.Debug.config
Global.asax     SOG.svc.cs      Web.Release.config
Global.asax.cs      Scripts         Web.config
Models          UI.csproj       WebApp
Properties      UI.csproj.DotSettings   packages.config
Ryans-MacBook-Air:UI ryanvice$ cd WebApp/
Ryans-MacBook-Air:WebApp ryanvice$ dir
-bash: dir: command not found
Ryans-MacBook-Air:WebApp ryanvice$ ls
Gruntfile.js    __tests__   bower.json  package.json
README.md   app     node_modules    preprocessor.js
Ryans-MacBook-Air:WebApp ryanvice$ grunt serve
Running "clean:serve" (clean) task
>> 1 path cleaned.

Running "browserify:dev" (browserify) task
>> Bundle .tmp/scripts/bundle/app.js created.

Running "compass:dev" (compass) task
Warning: Command failed: /bin/sh -c compass --version
/bin/sh: compass: command not found
 Use --force to continue.

Aborted due to warnings.


Execution Time (2015-10-02 11:40:05 UTC)
loading tasks   3.4s  ▇▇▇▇▇▇▇▇▇▇▇▇▇ 27%
browserify:dev  8.9s  ▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ 72%
Total 12.3s

Ryans-MacBook-Air:WebApp ryanvice$ npm install
npm WARN package.json [email protected] No description
npm WARN package.json [email protected] No repository field.
npm WARN package.json [email protected] license should be a valid SPDX license expression
Ryans-MacBook-Air:WebApp ryanvice$ grunt serve
Running "clean:serve" (clean) task
>> 1 path cleaned.

Running "browserify:dev" (browserify) task
>> Bundle .tmp/scripts/bundle/app.js created.

Running "compass:dev" (compass) task
Warning: Command failed: /bin/sh -c compass --version
/bin/sh: compass: command not found
 Use --force to continue.

Aborted due to warnings.


Execution Time (2015-10-02 11:47:00 UTC)
loading tasks   3.3s  ▇▇▇▇▇▇▇▇▇▇▇▇▇ 27%
browserify:dev  8.9s  ▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ 72%
Total 12.3s

Ryans-MacBook-Air:WebApp ryanvice$ brew install ruby
-bash: brew: command not found
Ryans-MacBook-Air:WebApp ryanvice$ grunt serve
Loading "Gruntfile.js" tasks...ERROR
>> SyntaxError: /Users/ryanvice/Documents/Code/Jones/SOG/UI/WebApp/Gruntfile.js:194
>>     'autoprefixer:dev',
>>     ^^^^^^^^^^^^^^^^^^
>> Unexpected string
Warning: Task "serve" not found. Use --force to continue.

Aborted due to warnings.
Ryans-MacBook-Air:WebApp ryanvice$ grunt serve
Running "clean:serve" (clean) task
>> 1 path cleaned.

Running "browserify:dev" (browserify) task
>> Bundle .tmp/scripts/bundle/app.js created.

Running "autoprefixer:dev" (autoprefixer) task

Running "connect:livereload" (connect) task
Started connect web server on http://localhost:3000

Running "watch" task
Waiting...
>> File "app/index.html" changed.
Completed in 0.001s at Fri Oct 02 2015 07:02:21 GMT-0500 (CDT) - Waiting...
^C

Execution Time (2015-10-02 11:55:20 UTC)
browserify:dev      9.3s  ▇ 2%
watch           7m 53.8s  ▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ 97%
Total 8m 6.7s

Ryans-MacBook-Air:WebApp ryanvice$ grunt serve
Running "clean:serve" (clean) task
>> 1 path cleaned.

Running "browserify:dev" (browserify) task
>> Bundle .tmp/scripts/bundle/app.js created.

Running "autoprefixer:dev" (autoprefixer) task

Running "connect:livereload" (connect) task
Started connect web server on http://localhost:3000

Running "watch" task
Waiting...
>> File "app/index.html" changed.
Completed in 0.001s at Fri Oct 02 2015 07:06:33 GMT-0500 (CDT) - Waiting...
>> File "app/index.html" changed.
Completed in 0.000s at Fri Oct 02 2015 07:06:35 GMT-0500 (CDT) - Waiting...
>> File "app/index.html" changed.
Completed in 0.000s at Fri Oct 02 2015 07:14:41 GMT-0500 (CDT) - Waiting...
^C

Execution Time (2015-10-02 12:03:31 UTC)
watch                  1d 23h 4m 33.4s  ▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ 100%
Total 1d 23h 4m 45.3s

Ryans-MacBook-Air:WebApp ryanvice$ pwd
/Users/ryanvice/Documents/Code/Jones/SOG/UI/WebApp
Ryans-MacBook-Air:WebApp ryanvice$ cd ../../../../MasteringReactValidaitons/
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ dir
-bash: dir: command not found
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ ls
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ npm install react browserify
[email protected] node_modules/react
└── [email protected] ([email protected], [email protected])

[email protected] node_modules/browserify
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected], [email protected], [email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected], [email protected])
├── [email protected]
├── [email protected] ([email protected], [email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected])
├── [email protected] ([email protected], [email protected], [email protected])
├── [email protected] ([email protected])
└── [email protected] ([email protected], [email protected], [email protected])
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ ls
node_modules
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ mkdir dist
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ dir
-bash: dir: command not found
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ ls
dist        node_modules
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ browserify app.js > dist/bundle.js
-bash: browserify: command not found
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ npm install react browserify --save-dev
[email protected] node_modules/react
└── [email protected] ([email protected], [email protected])

[email protected] node_modules/browserify
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected], [email protected], [email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected], [email protected])
├── [email protected]
├── [email protected] ([email protected], [email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected], [email protected])
└── [email protected] ([email protected], [email protected], [email protected])
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ browserify app.js > dist/bundle.js
-bash: browserify: command not found
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ npm install -g browserify
npm ERR! tar.unpack untar error /Users/ryanvice/.npm/browserify/11.2.0/package.tgz
npm ERR! Darwin 14.5.0
npm ERR! argv "node" "/usr/local/bin/npm" "install" "-g" "browserify"
npm ERR! node v0.12.7
npm ERR! npm  v2.11.3
npm ERR! path /usr/local/lib/node_modules/browserify
npm ERR! code EACCES
npm ERR! errno -13

npm ERR! Error: EACCES, mkdir '/usr/local/lib/node_modules/browserify'
npm ERR!     at Error (native)
npm ERR!  { [Error: EACCES, mkdir '/usr/local/lib/node_modules/browserify']
npm ERR!   errno: -13,
npm ERR!   code: 'EACCES',
npm ERR!   path: '/usr/local/lib/node_modules/browserify',
npm ERR!   fstream_type: 'Directory',
npm ERR!   fstream_path: '/usr/local/lib/node_modules/browserify',
npm ERR!   fstream_class: 'DirWriter',
npm ERR!   fstream_stack: 
npm ERR!    [ '/usr/local/lib/node_modules/npm/node_modules/fstream/lib/dir-writer.js:35:25',
npm ERR!      '/usr/local/lib/node_modules/npm/node_modules/mkdirp/index.js:47:53',
npm ERR!      'FSReqWrap.oncomplete (fs.js:95:15)' ] }
npm ERR! 
npm ERR! Please try running this command again as root/Administrator.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/ryanvice/Documents/Code/MasteringReactValidaitons/npm-debug.log
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ sudo npm install -g browserify
Password:
/usr/local/bin/browserify -> /usr/local/lib/node_modules/browserify/bin/cmd.js
[email protected] /usr/local/lib/node_modules/browserify
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected], [email protected], [email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected], [email protected])
├── [email protected]
├── [email protected] ([email protected], [email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected], [email protected])
└── [email protected] ([email protected], [email protected], [email protected])
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ browserify app.js > dist/bundle.js
Error: ENOTDIR, open '/Applications/Atom.app/Contents/Resources/app.asar/package.json'
    at Error (native)
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ pwd
/Users/ryanvice/Documents/Code/MasteringReactValidaitons
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ browserify app.js > bundle.js
Error: ENOTDIR, open '/Applications/Atom.app/Contents/Resources/app.asar/package.json'
    at Error (native)
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ rm -r
usage: rm [-f | -i] [-dPRrvW] file ...
       unlink file
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ rm . -r
rm: "." and ".." may not be removed
rm: -r: No such file or directory
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ npm install react browserify --save-dev
[email protected] node_modules/react
└── [email protected] ([email protected], [email protected])

[email protected] node_modules/browserify
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected], [email protected], [email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected], [email protected])
├── [email protected]
├── [email protected] ([email protected], [email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected], [email protected])
└── [email protected] ([email protected], [email protected], [email protected])
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ browserify app.js > bundle.js
Error: ENOTDIR, open '/Applications/Atom.app/Contents/Resources/app.asar/package.json'
    at Error (native)
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ browserify app.js > bundle.js
Error: ENOTDIR, open '/Applications/Atom.app/Contents/Resources/app.asar/package.json'
    at Error (native)
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ browserify app.js > bundle.js
Error: Cannot find module '/Users/ryanvice/Documents/Code/MasteringReactValidaitons/app.js' from '/Users/ryanvice/Documents/Code/MasteringReactValidaitons'
    at /usr/local/lib/node_modules/browserify/node_modules/resolve/lib/async.js:55:21
    at load (/usr/local/lib/node_modules/browserify/node_modules/resolve/lib/async.js:69:43)
    at onex (/usr/local/lib/node_modules/browserify/node_modules/resolve/lib/async.js:92:31)
    at /usr/local/lib/node_modules/browserify/node_modules/resolve/lib/async.js:22:47
    at FSReqWrap.oncomplete (fs.js:95:15)
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ browserify app.jsx > bundle.js
Error: Parsing file /Users/ryanvice/Documents/Code/MasteringReactValidaitons/app.jsx: Unexpected token (6:4)
    at Deps.parseDeps (/usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:437:28)
    at fromSource (/usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:376:44)
    at /usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:370:17
    at ConcatStream.<anonymous> (/usr/local/lib/node_modules/browserify/node_modules/concat-stream/index.js:36:43)
    at ConcatStream.emit (events.js:129:20)
    at finishMaybe (/usr/local/lib/node_modules/browserify/node_modules/concat-stream/node_modules/readable-stream/lib/_stream_writable.js:460:14)
    at endWritable (/usr/local/lib/node_modules/browserify/node_modules/concat-stream/node_modules/readable-stream/lib/_stream_writable.js:469:3)
    at ConcatStream.Writable.end (/usr/local/lib/node_modules/browserify/node_modules/concat-stream/node_modules/readable-stream/lib/_stream_writable.js:436:5)
    at DuplexWrapper.onend (/usr/local/lib/node_modules/browserify/node_modules/duplexer2/node_modules/readable-stream/lib/_stream_readable.js:537:10)
    at DuplexWrapper.g (events.js:199:16)
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ npm install reactify --save-dev
[email protected] node_modules/reactify
├── [email protected]
└── [email protected] ([email protected], [email protected])
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ browserify -t reactify app.jsx > bundle.js
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ browserify -t reactify app.jsx > bundle.js
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ browserify -t reactify app.jsx > bundle.js
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ browserify -t reactify app.jsx > bundle.js
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ browserify -t reactify app.jsx > build/bundle.js
-bash: build/bundle.js: No such file or directory
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ browserify -t reactify app.jsx > dist/bundle.js
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ npm install watchify --save-dev

> [email protected] install /Users/ryanvice/Documents/Code/MasteringReactValidaitons/node_modules/watchify/node_modules/chokidar/node_modules/fsevents
> node-pre-gyp install --fallback-to-build

[fsevents] Success: "/Users/ryanvice/Documents/Code/MasteringReactValidaitons/node_modules/watchify/node_modules/chokidar/node_modules/fsevents/lib/binding/Release/node-v14-darwin-x64/fse.node" is installed via remote
[email protected] node_modules/watchify
├── [email protected]
├── [email protected]
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected])
└── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected])
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ watchify -t reactify app.jsx > bundle.js
-bash: watchify: command not found
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ npm install -g watchify
npm ERR! tar.unpack untar error /Users/ryanvice/.npm/watchify/3.4.0/package.tgz
npm ERR! Darwin 14.5.0
npm ERR! argv "node" "/usr/local/bin/npm" "install" "-g" "watchify"
npm ERR! node v0.12.7
npm ERR! npm  v2.11.3
npm ERR! path /usr/local/lib/node_modules/watchify
npm ERR! code EACCES
npm ERR! errno -13

npm ERR! Error: EACCES, mkdir '/usr/local/lib/node_modules/watchify'
npm ERR!     at Error (native)
npm ERR!  { [Error: EACCES, mkdir '/usr/local/lib/node_modules/watchify']
npm ERR!   errno: -13,
npm ERR!   code: 'EACCES',
npm ERR!   path: '/usr/local/lib/node_modules/watchify',
npm ERR!   fstream_type: 'Directory',
npm ERR!   fstream_path: '/usr/local/lib/node_modules/watchify',
npm ERR!   fstream_class: 'DirWriter',
npm ERR!   fstream_stack: 
npm ERR!    [ '/usr/local/lib/node_modules/npm/node_modules/fstream/lib/dir-writer.js:35:25',
npm ERR!      '/usr/local/lib/node_modules/npm/node_modules/mkdirp/index.js:47:53',
npm ERR!      'FSReqWrap.oncomplete (fs.js:95:15)' ] }
npm ERR! 
npm ERR! Please try running this command again as root/Administrator.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/ryanvice/Documents/Code/MasteringReactValidaitons/npm-debug.log
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ sudo npm install -g watchify
Password:
-
> [email protected] install /usr/local/lib/node_modules/watchify/node_modules/chokidar/node_modules/fsevents
> node-pre-gyp install --fallback-to-build

[fsevents] Success: "/usr/local/lib/node_modules/watchify/node_modules/chokidar/node_modules/fsevents/lib/binding/Release/node-v14-darwin-x64/fse.node" is installed via remote
/usr/local/bin/watchify -> /usr/local/lib/node_modules/watchify/bin/cmd.js
[email protected] /usr/local/lib/node_modules/watchify
├── [email protected]
├── [email protected]
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected])
└── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected])
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ watchify -t reactify app.jsx > bundle.js
You MUST specify an outfile with -o.
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ watchify -t reactify app.jsx -o bundle.js
^C
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ watchify -t reactify app.jsx -o bundle.js -v
617404 bytes written to bundle.js (2.91 seconds)
617404 bytes written to bundle.js (0.29 seconds)
^C
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ watchify -t reactify app.jsx -o dist/bundle.js -v
617404 bytes written to dist/bundle.js (3.16 seconds)
bower install bootstrap --save
^C
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ npm install bootstrap --save
[email protected] node_modules/bootstrap
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ watchify -t reactify app.jsx -o dist/bundle.js -v
617662 bytes written to dist/bundle.js (3.13 seconds)
617663 bytes written to dist/bundle.js (0.24 seconds)
617662 bytes written to dist/bundle.js (0.17 seconds)
ReactifyError: /Users/ryanvice/Documents/Code/MasteringReactValidaitons/app.jsx: Parse Error: Line 37: Expected corresponding JSX closing tag for hi while parsing file: /Users/ryanvice/Documents/Code/MasteringReactValidaitons/app.jsx
617750 bytes written to dist/bundle.js (0.25 seconds)
^C
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ npm install --save react-validation-mixin
[email protected] node_modules/react-validation-mixin
├── [email protected]
├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected])
└── [email protected] ([email protected])
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ npm install --save joi-validation-strategy
npm WARN peerDependencies The peer dependency joi@>=5.1.0 included from joi-validation-strategy will no
npm WARN peerDependencies longer be automatically installed to fulfill the peerDependency 
npm WARN peerDependencies in npm 3+. Your application will need to depend on it explicitly.
[email protected] node_modules/joi
├── [email protected]
├── [email protected]
├── [email protected]
└── [email protected]

[email protected] node_modules/joi-validation-strategy
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected])
└── [email protected] ([email protected])
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ npm install --save joi
[email protected] node_modules/joi
├── [email protected]
├── [email protected]
├── [email protected]
└── [email protected]
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ watchify -t reactify app.jsx -o dist/bundle.js -v
618070 bytes written to dist/bundle.js (2.86 seconds)
618232 bytes written to dist/bundle.js (0.35 seconds)
618250 bytes written to dist/bundle.js (0.24 seconds)
618231 bytes written to dist/bundle.js (0.19 seconds)
618250 bytes written to dist/bundle.js (0.16 seconds)
618250 bytes written to dist/bundle.js (0.36 seconds)
1607568 bytes written to dist/bundle.js (4.73 seconds)
Error: Cannot find module 'classnames' from '/Users/ryanvice/Documents/Code/MasteringReactValidaitons'
Error: Cannot find module 'classnames' from '/Users/ryanvice/Documents/Code/MasteringReactValidaitons'
1606745 bytes written to dist/bundle.js (0.54 seconds)
1606737 bytes written to dist/bundle.js (0.50 seconds)
1606604 bytes written to dist/bundle.js (0.55 seconds)
1606596 bytes written to dist/bundle.js (0.43 seconds)
ReactifyError: /Users/ryanvice/Documents/Code/MasteringReactValidaitons/app.jsx: Parse Error: Line 33: Unexpected token > while parsing file: /Users/ryanvice/Documents/Code/MasteringReactValidaitons/app.jsx
ReactifyError: /Users/ryanvice/Documents/Code/MasteringReactValidaitons/app.jsx: Parse Error: Line 33: Unexpected token > while parsing file: /Users/ryanvice/Documents/Code/MasteringReactValidaitons/app.jsx
1606568 bytes written to dist/bundle.js (0.57 seconds)
1606561 bytes written to dist/bundle.js (0.44 seconds)
1606637 bytes written to dist/bundle.js (0.58 seconds)
1607059 bytes written to dist/bundle.js (0.70 seconds)
1607345 bytes written to dist/bundle.js (0.63 seconds)
1607373 bytes written to dist/bundle.js (0.65 seconds)
1607417 bytes written to dist/bundle.js (0.44 seconds)
1607395 bytes written to dist/bundle.js (1.22 seconds)
ReactifyError: /Users/ryanvice/Documents/Code/MasteringReactValidaitons/app.jsx: Parse Error: Line 10: Duplicate data property in object literal not allowed in strict mode while parsing file: /Users/ryanvice/Documents/Code/MasteringReactValidaitons/app.jsx
1607521 bytes written to dist/bundle.js (0.72 seconds)
1607608 bytes written to dist/bundle.js (0.66 seconds)
1607611 bytes written to dist/bundle.js (0.46 seconds)
1607622 bytes written to dist/bundle.js (0.49 seconds)
1607756 bytes written to dist/bundle.js (0.64 seconds)
1607760 bytes written to dist/bundle.js (0.45 seconds)
1607760 bytes written to dist/bundle.js (0.68 seconds)
^[[1;2D^C
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ git init
Initialized empty Git repository in /Users/ryanvice/Documents/Code/MasteringReactValidaitons/.git/
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ remote add origin [email protected]:RyanAtViceSoftware/MasteringReactJsValidationExample.git
-bash: remote: command not found
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ git remote add origin [email protected]:RyanAtViceSoftware/MasteringReactJsValidationExample.git
fatal: remote origin already exists.
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ push -u origin master
-bash: push: command not found
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ git push -u origin master
Warning: Permanently added the RSA host key for IP address '192.30.252.129' to the list of known hosts.
Permission denied (publickey).
fatal: Could not read from remote repository.

Please make sure you have the correct access rights
and the repository exists.
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ watchify -t reactify app.jsx -o dist/bundle.js -v
1607931 bytes written to dist/bundle.js (9.16 seconds)
1607941 bytes written to dist/bundle.js (0.71 seconds)
1607934 bytes written to dist/bundle.js (0.46 seconds)
1607760 bytes written to dist/bundle.js (0.90 seconds)
1607711 bytes written to dist/bundle.js (0.48 seconds)
ReactifyError: /Users/ryanvice/Documents/Code/MasteringReactValidaitons/app.jsx: Parse Error: Line 25: Unexpected token , while parsing file: /Users/ryanvice/Documents/Code/MasteringReactValidaitons/app.jsx
ReactifyError: /Users/ryanvice/Documents/Code/MasteringReactValidaitons/app.jsx: Parse Error: Line 79: Unexpected token ; while parsing file: /Users/ryanvice/Documents/Code/MasteringReactValidaitons/app.jsx
1607694 bytes written to dist/bundle.js (0.73 seconds)
1607706 bytes written to dist/bundle.js (0.47 seconds)
1607714 bytes written to dist/bundle.js (0.65 seconds)
1607717 bytes written to dist/bundle.js (1.13 seconds)
1607835 bytes written to dist/bundle.js (1.42 seconds)
1607835 bytes written to dist/bundle.js (1.04 seconds)
1607847 bytes written to dist/bundle.js (0.45 seconds)
1607945 bytes written to dist/bundle.js (0.71 seconds)
1607956 bytes written to dist/bundle.js (0.56 seconds)
1607952 bytes written to dist/bundle.js (0.53 seconds)
1607949 bytes written to dist/bundle.js (0.97 seconds)
1607949 bytes written to dist/bundle.js (0.73 seconds)
1607949 bytes written to dist/bundle.js (0.73 seconds)
1608006 bytes written to dist/bundle.js (0.61 seconds)
1608021 bytes written to dist/bundle.js (0.63 seconds)
1608021 bytes written to dist/bundle.js (0.44 seconds)
1607999 bytes written to dist/bundle.js (0.72 seconds)
1607972 bytes written to dist/bundle.js (0.59 seconds)
ReactifyError: /Users/ryanvice/Documents/Code/MasteringReactValidaitons/app.jsx: Parse Error: Line 16: JSX attributes must only be assigned a non-empty expression while parsing file: /Users/ryanvice/Documents/Code/MasteringReactValidaitons/app.jsx
1608549 bytes written to dist/bundle.js (0.71 seconds)
1608580 bytes written to dist/bundle.js (0.47 seconds)
1608585 bytes written to dist/bundle.js (0.62 seconds)
1608622 bytes written to dist/bundle.js (0.51 seconds)
1608625 bytes written to dist/bundle.js (0.67 seconds)
1608630 bytes written to dist/bundle.js (0.47 seconds)
1608048 bytes written to dist/bundle.js (0.45 seconds)
1608045 bytes written to dist/bundle.js (0.59 seconds)
1608109 bytes written to dist/bundle.js (0.47 seconds)
1608129 bytes written to dist/bundle.js (0.59 seconds)
1608118 bytes written to dist/bundle.js (0.50 seconds)
1608235 bytes written to dist/bundle.js (0.56 seconds)
1608223 bytes written to dist/bundle.js (0.40 seconds)
1608249 bytes written to dist/bundle.js (0.60 seconds)
1608253 bytes written to dist/bundle.js (0.43 seconds)
1608325 bytes written to dist/bundle.js (0.77 seconds)
1608395 bytes written to dist/bundle.js (0.52 seconds)
1608323 bytes written to dist/bundle.js (0.88 seconds)
1608365 bytes written to dist/bundle.js (0.62 seconds)
1608887 bytes written to dist/bundle.js (0.77 seconds)
1608928 bytes written to dist/bundle.js (0.42 seconds)
1609073 bytes written to dist/bundle.js (0.68 seconds)
1609096 bytes written to dist/bundle.js (0.68 seconds)
1609343 bytes written to dist/bundle.js (0.65 seconds)
1609197 bytes written to dist/bundle.js (0.46 seconds)
1609271 bytes written to dist/bundle.js (0.48 seconds)
1609269 bytes written to dist/bundle.js (0.40 seconds)
ReactifyError: /Users/ryanvice/Documents/Code/MasteringReactValidaitons/app.jsx: Parse Error: Line 6: Unexpected token ] while parsing file: /Users/ryanvice/Documents/Code/MasteringReactValidaitons/app.jsx
1609298 bytes written to dist/bundle.js (0.47 seconds)
1609297 bytes written to dist/bundle.js (0.61 seconds)
^C
Ryans-MacBook-Air:MasteringReactValidaitons ryanvice$ cd ..
Ryans-MacBook-Air:Code ryanvice$ pwd
/Users/ryanvice/Documents/Code
Ryans-MacBook-Air:Code ryanvice$ cd electron-react-boilerplate-master/
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm install
npm WARN package.json [email protected] No bin file found at ./node_modules/.bin/electron
[email protected] node_modules/keymirror

[email protected] node_modules/object-assign

[email protected] node_modules/electron-debug

[email protected] node_modules/debug
└── [email protected]

[email protected] node_modules/react-router
├── [email protected]
└── [email protected]

[email protected] node_modules/react
└── [email protected] ([email protected], [email protected])

[email protected] node_modules/flux
├── [email protected]
├── [email protected]
└── [email protected] ([email protected], [email protected], [email protected])
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm run package

> [email protected] package /Users/ryanvice/Documents/Code/electron-react-boilerplate-master
> node package.js

module.js:338
    throw err;
          ^
Error: Cannot find module 'webpack'
    at Function.Module._resolveFilename (module.js:336:15)
    at Function.Module._load (module.js:278:25)
    at Module.require (module.js:365:17)
    at require (module.js:384:17)
    at Object.<anonymous> (/Users/ryanvice/Documents/Code/electron-react-boilerplate-master/package.js:3:15)
    at Module._compile (module.js:460:26)
    at Object.Module._extensions..js (module.js:478:10)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Function.Module.runMain (module.js:501:10)

npm ERR! Darwin 14.5.0
npm ERR! argv "node" "/usr/local/bin/npm" "run" "package"
npm ERR! node v0.12.7
npm ERR! npm  v2.11.3
npm ERR! code ELIFECYCLE
npm ERR! [email protected] package: `node package.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] package script 'node package.js'.
npm ERR! This is most likely a problem with the electron-react-boilerplate package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     node package.js
npm ERR! You can get their info via:
npm ERR!     npm owner ls electron-react-boilerplate
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/ryanvice/Documents/Code/electron-react-boilerplate-master/npm-debug.log
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm install -g webpack
npm ERR! tar.unpack untar error /Users/ryanvice/.npm/webpack/1.12.2/package.tgz
npm ERR! Darwin 14.5.0
npm ERR! argv "node" "/usr/local/bin/npm" "install" "-g" "webpack"
npm ERR! node v0.12.7
npm ERR! npm  v2.11.3
npm ERR! path /usr/local/lib/node_modules/webpack
npm ERR! code EACCES
npm ERR! errno -13

npm ERR! Error: EACCES, mkdir '/usr/local/lib/node_modules/webpack'
npm ERR!     at Error (native)
npm ERR!  { [Error: EACCES, mkdir '/usr/local/lib/node_modules/webpack']
npm ERR!   errno: -13,
npm ERR!   code: 'EACCES',
npm ERR!   path: '/usr/local/lib/node_modules/webpack',
npm ERR!   fstream_type: 'Directory',
npm ERR!   fstream_path: '/usr/local/lib/node_modules/webpack',
npm ERR!   fstream_class: 'DirWriter',
npm ERR!   fstream_stack: 
npm ERR!    [ '/usr/local/lib/node_modules/npm/node_modules/fstream/lib/dir-writer.js:35:25',
npm ERR!      '/usr/local/lib/node_modules/npm/node_modules/mkdirp/index.js:47:53',
npm ERR!      'FSReqWrap.oncomplete (fs.js:95:15)' ] }
npm ERR! 
npm ERR! Please try running this command again as root/Administrator.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/ryanvice/Documents/Code/electron-react-boilerplate-master/npm-debug.log
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ sudo npm install webpack -g
Password:
-
> [email protected] install /usr/local/lib/node_modules/webpack/node_modules/watchpack/node_modules/chokidar/node_modules/fsevents
> node-pre-gyp install --fallback-to-build

[fsevents] Success: "/usr/local/lib/node_modules/webpack/node_modules/watchpack/node_modules/chokidar/node_modules/fsevents/lib/binding/Release/node-v14-darwin-x64/fse.node" is installed via remote
/usr/local/bin/webpack -> /usr/local/lib/node_modules/webpack/bin/webpack.js
[email protected] /usr/local/lib/node_modules/webpack
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected]
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected], [email protected], [email protected])
├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected])
└── [email protected] ([email protected], [email protected], [email protected])
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm run package

> [email protected] package /Users/ryanvice/Documents/Code/electron-react-boilerplate-master
> node package.js

module.js:338
    throw err;
          ^
Error: Cannot find module 'webpack'
    at Function.Module._resolveFilename (module.js:336:15)
    at Function.Module._load (module.js:278:25)
    at Module.require (module.js:365:17)
    at require (module.js:384:17)
    at Object.<anonymous> (/Users/ryanvice/Documents/Code/electron-react-boilerplate-master/package.js:3:15)
    at Module._compile (module.js:460:26)
    at Object.Module._extensions..js (module.js:478:10)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Function.Module.runMain (module.js:501:10)

npm ERR! Darwin 14.5.0
npm ERR! argv "node" "/usr/local/bin/npm" "run" "package"
npm ERR! node v0.12.7
npm ERR! npm  v2.11.3
npm ERR! code ELIFECYCLE
npm ERR! [email protected] package: `node package.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] package script 'node package.js'.
npm ERR! This is most likely a problem with the electron-react-boilerplate package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     node package.js
npm ERR! You can get their info via:
npm ERR!     npm owner ls electron-react-boilerplate
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/ryanvice/Documents/Code/electron-react-boilerplate-master/npm-debug.log
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm install webpack --save-dev
npm WARN package.json [email protected] No bin file found at ./node_modules/.bin/electron
|
> [email protected] install /Users/ryanvice/Documents/Code/electron-react-boilerplate-master/node_modules/webpack/node_modules/watchpack/node_modules/chokidar/node_modules/fsevents
> node-pre-gyp install --fallback-to-build

[fsevents] Success: "/Users/ryanvice/Documents/Code/electron-react-boilerplate-master/node_modules/webpack/node_modules/watchpack/node_modules/chokidar/node_modules/fsevents/lib/binding/Release/node-v14-darwin-x64/fse.node" is installed via remote
[email protected] node_modules/webpack
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected]
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected], [email protected], [email protected])
├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected])
└── [email protected] ([email protected], [email protected], [email protected])
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm run package

> [email protected] package /Users/ryanvice/Documents/Code/electron-react-boilerplate-master
> node package.js

module.js:338
    throw err;
          ^
Error: Cannot find module 'extract-text-webpack-plugin'
    at Function.Module._resolveFilename (module.js:336:15)
    at Function.Module._load (module.js:278:25)
    at Module.require (module.js:365:17)
    at require (module.js:384:17)
    at Object.<anonymous> (/Users/ryanvice/Documents/Code/electron-react-boilerplate-master/webpack.config.production.js:5:25)
    at Module._compile (module.js:460:26)
    at Object.Module._extensions..js (module.js:478:10)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Module.require (module.js:365:17)

npm ERR! Darwin 14.5.0
npm ERR! argv "node" "/usr/local/bin/npm" "run" "package"
npm ERR! node v0.12.7
npm ERR! npm  v2.11.3
npm ERR! code ELIFECYCLE
npm ERR! [email protected] package: `node package.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] package script 'node package.js'.
npm ERR! This is most likely a problem with the electron-react-boilerplate package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     node package.js
npm ERR! You can get their info via:
npm ERR!     npm owner ls electron-react-boilerplate
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/ryanvice/Documents/Code/electron-react-boilerplate-master/npm-debug.log
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm install
npm WARN package.json [email protected] No bin file found at ./node_modules/.bin/electron
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm install extract-text-webpack-plugin --save-dev
npm WARN package.json [email protected] No bin file found at ./node_modules/.bin/electron
[email protected] node_modules/extract-text-webpack-plugin
├── [email protected]
└── [email protected] ([email protected], [email protected])
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm install
npm WARN package.json [email protected] No bin file found at ./node_modules/.bin/electron
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm run package

> [email protected] package /Users/ryanvice/Documents/Code/electron-react-boilerplate-master
> node package.js

module.js:338
    throw err;
          ^
Error: Cannot find module 'webpack-target-electron-renderer'
    at Function.Module._resolveFilename (module.js:336:15)
    at Function.Module._load (module.js:278:25)
    at Module.require (module.js:365:17)
    at require (module.js:384:17)
    at Object.<anonymous> (/Users/ryanvice/Documents/Code/electron-react-boilerplate-master/webpack.config.production.js:6:37)
    at Module._compile (module.js:460:26)
    at Object.Module._extensions..js (module.js:478:10)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Module.require (module.js:365:17)

npm ERR! Darwin 14.5.0
npm ERR! argv "node" "/usr/local/bin/npm" "run" "package"
npm ERR! node v0.12.7
npm ERR! npm  v2.11.3
npm ERR! code ELIFECYCLE
npm ERR! [email protected] package: `node package.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] package script 'node package.js'.
npm ERR! This is most likely a problem with the electron-react-boilerplate package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     node package.js
npm ERR! You can get their info via:
npm ERR!     npm owner ls electron-react-boilerplate
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/ryanvice/Documents/Code/electron-react-boilerplate-master/npm-debug.log
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm install webpack-target-electron-renderer --save-dev
npm WARN package.json [email protected] No bin file found at ./node_modules/.bin/electron
[email protected] node_modules/webpack-target-electron-renderer
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm install webpack-target-electron-renderer --save-dev
npm WARN package.json [email protected] No bin file found at ./node_modules/.bin/electron
[email protected] node_modules/webpack-target-electron-renderer
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm run package

> [email protected] package /Users/ryanvice/Documents/Code/electron-react-boilerplate-master
> node package.js

module.js:338
    throw err;
          ^
Error: Cannot find module 'electron-packager'
    at Function.Module._resolveFilename (module.js:336:15)
    at Function.Module._load (module.js:278:25)
    at Module.require (module.js:365:17)
    at require (module.js:384:17)
    at Object.<anonymous> (/Users/ryanvice/Documents/Code/electron-react-boilerplate-master/package.js:5:16)
    at Module._compile (module.js:460:26)
    at Object.Module._extensions..js (module.js:478:10)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Function.Module.runMain (module.js:501:10)

npm ERR! Darwin 14.5.0
npm ERR! argv "node" "/usr/local/bin/npm" "run" "package"
npm ERR! node v0.12.7
npm ERR! npm  v2.11.3
npm ERR! code ELIFECYCLE
npm ERR! [email protected] package: `node package.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] package script 'node package.js'.
npm ERR! This is most likely a problem with the electron-react-boilerplate package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     node package.js
npm ERR! You can get their info via:
npm ERR!     npm owner ls electron-react-boilerplate
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/ryanvice/Documents/Code/electron-react-boilerplate-master/npm-debug.log
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm install electron-packager --save-dev
npm WARN package.json [email protected] No bin file found at ./node_modules/.bin/electron
npm WARN engine [email protected]: wanted: {"node":"0.8.x || 0.10.x"} (current: {"node":"0.12.7","npm":"2.11.3"})
[email protected] node_modules/electron-packager
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected])
├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected], [email protected])
└── [email protected] ([email protected], [email protected], [email protected], [email protected])
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm run package

> [email protected] package /Users/ryanvice/Documents/Code/electron-react-boilerplate-master
> node package.js

module.js:338
    throw err;
          ^
Error: Cannot find module 'del'
    at Function.Module._resolveFilename (module.js:336:15)
    at Function.Module._load (module.js:278:25)
    at Module.require (module.js:365:17)
    at require (module.js:384:17)
    at Object.<anonymous> (/Users/ryanvice/Documents/Code/electron-react-boilerplate-master/package.js:7:11)
    at Module._compile (module.js:460:26)
    at Object.Module._extensions..js (module.js:478:10)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Function.Module.runMain (module.js:501:10)

npm ERR! Darwin 14.5.0
npm ERR! argv "node" "/usr/local/bin/npm" "run" "package"
npm ERR! node v0.12.7
npm ERR! npm  v2.11.3
npm ERR! code ELIFECYCLE
npm ERR! [email protected] package: `node package.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] package script 'node package.js'.
npm ERR! This is most likely a problem with the electron-react-boilerplate package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     node package.js
npm ERR! You can get their info via:
npm ERR!     npm owner ls electron-react-boilerplate
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/ryanvice/Documents/Code/electron-react-boilerplate-master/npm-debug.log
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm install del --save-dev
npm WARN package.json [email protected] No bin file found at ./node_modules/.bin/electron
[email protected] node_modules/del
├── [email protected]
├── [email protected]
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected], [email protected])
└── [email protected] ([email protected])
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm run package

> [email protected] package /Users/ryanvice/Documents/Code/electron-react-boilerplate-master
> node package.js

module.js:338
    throw err;
          ^
Error: Cannot find module 'minimist'
    at Function.Module._resolveFilename (module.js:336:15)
    at Function.Module._load (module.js:278:25)
    at Module.require (module.js:365:17)
    at require (module.js:384:17)
    at Object.<anonymous> (/Users/ryanvice/Documents/Code/electron-react-boilerplate-master/package.js:9:12)
    at Module._compile (module.js:460:26)
    at Object.Module._extensions..js (module.js:478:10)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Function.Module.runMain (module.js:501:10)

npm ERR! Darwin 14.5.0
npm ERR! argv "node" "/usr/local/bin/npm" "run" "package"
npm ERR! node v0.12.7
npm ERR! npm  v2.11.3
npm ERR! code ELIFECYCLE
npm ERR! [email protected] package: `node package.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] package script 'node package.js'.
npm ERR! This is most likely a problem with the electron-react-boilerplate package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     node package.js
npm ERR! You can get their info via:
npm ERR!     npm owner ls electron-react-boilerplate
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/ryanvice/Documents/Code/electron-react-boilerplate-master/npm-debug.log
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm install minimist --save-dev
npm WARN package.json [email protected] No bin file found at ./node_modules/.bin/electron
[email protected] node_modules/minimist
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm run package

> [email protected] package /Users/ryanvice/Documents/Code/electron-react-boilerplate-master
> node package.js

start pack...
Downloading electron-v0.28.3-darwin-x64.zip
[============================================>] 100.0% of 36.96 MB (5.91 MB/s)
Packaging app for platform darwin x64 using electron v0.28.3
darwin-x64 finished!
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm run package -v
2.11.3
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm run package --verbose
npm info it worked if it ends with ok
npm verb cli [ 'node', '/usr/local/bin/npm', 'run', 'package', '--verbose' ]
npm info using [email protected]
npm info using [email protected]
npm verb run-script [ 'prepackage', 'package', 'postpackage' ]
npm info prepackage [email protected]
npm info package [email protected]

> [email protected] package /Users/ryanvice/Documents/Code/electron-react-boilerplate-master
> node package.js

start pack...
Packaging app for platform darwin x64 using electron v0.28.3
darwin-x64 finished!
npm verb unsafe-perm in lifecycle true
npm info postpackage [email protected]
npm verb exit [ 0, true ]
npm info ok 
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm run package --verbose
npm info it worked if it ends with ok
npm verb cli [ 'node', '/usr/local/bin/npm', 'run', 'package', '--verbose' ]
npm info using [email protected]
npm info using [email protected]
npm verb run-script [ 'prepackage', 'package', 'postpackage' ]
npm info prepackage [email protected]
npm info package [email protected]

> [email protected] package /Users/ryanvice/Documents/Code/electron-react-boilerplate-master
> node package.js

start pack...
Packaging app for platform darwin x64 using electron v0.28.3
darwin-x64 finished!
npm verb unsafe-perm in lifecycle true
npm info postpackage [email protected]
npm verb exit [ 0, true ]
npm info ok 
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm run hot-server

> [email protected] hot-server /Users/ryanvice/Documents/Code/electron-react-boilerplate-master
> node server.js

module.js:338
    throw err;
          ^
Error: Cannot find module 'express'
    at Function.Module._resolveFilename (module.js:336:15)
    at Function.Module._load (module.js:278:25)
    at Module.require (module.js:365:17)
    at require (module.js:384:17)
    at Object.<anonymous> (/Users/ryanvice/Documents/Code/electron-react-boilerplate-master/server.js:2:15)
    at Module._compile (module.js:460:26)
    at Object.Module._extensions..js (module.js:478:10)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Function.Module.runMain (module.js:501:10)

npm ERR! Darwin 14.5.0
npm ERR! argv "node" "/usr/local/bin/npm" "run" "hot-server"
npm ERR! node v0.12.7
npm ERR! npm  v2.11.3
npm ERR! code ELIFECYCLE
npm ERR! [email protected] hot-server: `node server.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] hot-server script 'node server.js'.
npm ERR! This is most likely a problem with the electron-react-boilerplate package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     node server.js
npm ERR! You can get their info via:
npm ERR!     npm owner ls electron-react-boilerplate
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/ryanvice/Documents/Code/electron-react-boilerplate-master/npm-debug.log
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm install express --save-dev
npm WARN package.json [email protected] No bin file found at ./node_modules/.bin/electron
[email protected] node_modules/express
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected])
└── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected])
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm run hot-server

> [email protected] hot-server /Users/ryanvice/Documents/Code/electron-react-boilerplate-master
> node server.js

module.js:338
    throw err;
          ^
Error: Cannot find module 'webpack-dev-middleware'
    at Function.Module._resolveFilename (module.js:336:15)
    at Function.Module._load (module.js:278:25)
    at Module.require (module.js:365:17)
    at require (module.js:384:17)
    at Object.<anonymous> (/Users/ryanvice/Documents/Code/electron-react-boilerplate-master/server.js:9:9)
    at Module._compile (module.js:460:26)
    at Object.Module._extensions..js (module.js:478:10)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Function.Module.runMain (module.js:501:10)

npm ERR! Darwin 14.5.0
npm ERR! argv "node" "/usr/local/bin/npm" "run" "hot-server"
npm ERR! node v0.12.7
npm ERR! npm  v2.11.3
npm ERR! code ELIFECYCLE
npm ERR! [email protected] hot-server: `node server.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] hot-server script 'node server.js'.
npm ERR! This is most likely a problem with the electron-react-boilerplate package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     node server.js
npm ERR! You can get their info via:
npm ERR!     npm owner ls electron-react-boilerplate
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/ryanvice/Documents/Code/electron-react-boilerplate-master/npm-debug.log
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm run webpack-dev-middleware --save-dev
npm ERR! Darwin 14.5.0
npm ERR! argv "node" "/usr/local/bin/npm" "run" "webpack-dev-middleware" "--save-dev"
npm ERR! node v0.12.7
npm ERR! npm  v2.11.3

npm ERR! missing script: webpack-dev-middleware
npm ERR! 
npm ERR! If you need help, you may report this error at:
npm ERR!     <https://github.com/npm/npm/issues>

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/ryanvice/Documents/Code/electron-react-boilerplate-master/npm-debug.log
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm install webpack-dev-middleware --save-dev
npm WARN package.json [email protected] No bin file found at ./node_modules/.bin/electron
[email protected] node_modules/webpack-dev-middleware
├── [email protected]
└── [email protected]
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm run hot-server

> [email protected] hot-server /Users/ryanvice/Documents/Code/electron-react-boilerplate-master
> node server.js

module.js:338
    throw err;
          ^
Error: Cannot find module 'webpack-hot-middleware'
    at Function.Module._resolveFilename (module.js:336:15)
    at Function.Module._load (module.js:278:25)
    at Module.require (module.js:365:17)
    at require (module.js:384:17)
    at Object.<anonymous> (/Users/ryanvice/Documents/Code/electron-react-boilerplate-master/server.js:16:9)
    at Module._compile (module.js:460:26)
    at Object.Module._extensions..js (module.js:478:10)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Function.Module.runMain (module.js:501:10)

npm ERR! Darwin 14.5.0
npm ERR! argv "node" "/usr/local/bin/npm" "run" "hot-server"
npm ERR! node v0.12.7
npm ERR! npm  v2.11.3
npm ERR! code ELIFECYCLE
npm ERR! [email protected] hot-server: `node server.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] hot-server script 'node server.js'.
npm ERR! This is most likely a problem with the electron-react-boilerplate package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     node server.js
npm ERR! You can get their info via:
npm ERR!     npm owner ls electron-react-boilerplate
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/ryanvice/Documents/Code/electron-react-boilerplate-master/npm-debug.log
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$ npm install webpack-hot-middleware --save-dev
npm WARN package.json [email protected] No bin file found at ./node_modules/.bin/electron
[email protected] node_modules/webpack-hot-middleware
├── [email protected]
└── [email protected] ([email protected])
Ryans-MacBook-Air:electron-react-boilerplate-master ryanvice$

Big blob files in git history

When cloning this boilerplate and pushing it to Github, I first got a warning about big files. I investigated a bit further and found some files in your git history which should probably be pruned:

It's as simple as using this tool to clean the nasty big files out of your history, which would be friendlier for people to use (and a bit faster to clone/push, too).

eslint

There is a problem with eslintrc because line 11 misses a comma. Therefor the linter can't parse the file.

Besides eslint I'm using babel-eslint and eslint-plugin-react. With these you get clean and detailed and linting for react, jsx and es6.

My .eslintrc file looks like this

{
  "parser": "babel-eslint",
  "plugins": [
    "react"
  ],
  "ecmaFeatures": {
    "jsx": true,
    "modules": true
  },
  "env": {
    "node": true,
    "mocha": true,
    "es6": true,
    "browser": true
  },
  "globals": {

  },
  "rules": {
    "quotes": [2, "single"],
    "semi": [2, "never"],
    "curly": [2, "multi-line"],
    "no-underscore-dangle": 0,

    "react/display-name": 0,
    "react/jsx-boolean-value": 1,
    "react/jsx-quotes": 1,
    "react/jsx-no-undef": 1,
    "react/jsx-sort-props": 1,
    "react/jsx-sort-prop-types": 1,
    "react/jsx-uses-react": 1,
    "react/jsx-uses-vars": 1,
    "react/no-did-mount-set-state": 1,
    "react/no-did-update-set-state": 1,
    "react/no-multi-comp": 1,
    "react/no-unknown-property": 1,
    "react/prop-types": 1,
    "react/react-in-jsx-scope": 1,
    "react/self-closing-comp": 1,
    "react/sort-comp": 0,
    "react/wrap-multilines": 1
  }
}

Unable to import Electron modules

I'm unable to import Electron modules, such as dialog, in the example project.

I installed and saved the module:

npm install electron --save

Required Electron in Home.js

// app/components/Home.js
import React, { Component } from 'react';
import { Link } from 'react-router';
import styles from './Home.module.css';
import { dialog } from 'electron';

But it fails to compile. Here's the error output:

ERROR in ./~/electron/index.js
Module not found: Error: Cannot resolve 'file' or 'directory' ./lib-cov/electron in /Users/jcummins/workspace/js/electron-react-boilerplate/node_modules/electron
 @ ./~/electron/index.js 2:4-33

ERROR in ./~/drip/index.js
Module not found: Error: Cannot resolve 'file' or 'directory' ./lib-cov/drip in /Users/jcummins/workspace/js/electron-react-boilerplate/node_modules/drip
 @ ./~/drip/index.js 2:4-29

ERROR in ./~/tea-concat/index.js
Module not found: Error: Cannot resolve 'file' or 'directory' ./lib-cov/concat in /Users/jcummins/workspace/js/electron-react-boilerplate/node_modules/tea-concat
 @ ./~/tea-concat/index.js 2:4-31

I have tried various other ways of importing the module, such as const {dialog} = require('electron'), but I get the same error.

Fix Readme link

Now that this repo is using react-transform-hmr we need to point to React Trasform HMR instead of React Hot Loader in the readme.

[Proposal] Use redux-electron-store

We can use redux-electron-store, in this way, we can let main process dispatch actions to other BrowserWindow.

Main process store reload: samiskin/redux-electron-store#3
One issue at samiskin/redux-electron-store#6, otherwise we can split DevTools to another BrowserWindow.

I have such a demand, but this boilerplate will become too complicated? I would like to know everyone views.

How to add React devtools

Hi, I am struggeling to add the react devtools. I'm hoping you have a clue. Here's a SO post I made with more details...

http://stackoverflow.com/questions/30578963/how-to-add-react-devtools-to-electron-shell

Using npm > 3 will cause packaging to miss dependencies

Using this logic for gathering npm modules to ignore does not work correctly for npm versions greater than 3. I tried this with npm 3.4.0.

var devDeps = Object.keys(require('./package.json').devDependencies);
var DEFAULT_OPTS = {
   ....,
  ignore: [
   ....,
  ].concat(devDeps.map(function(name) { return '/node_modules/' + name + '($|/)'; }))
};

https://github.com/chentsulin/electron-react-boilerplate/blob/master/package.js#L26

With npm > 3, there are child dependencies of top-level production dependencies in the node_modules folder. (async may be listed in devDependencies and is also a child dependency of a project like request)

The necessary dependency is not bundled by electron-packager.

I've tried a few approaches, but I don't have a solution for this, yet.

Thanks for the great work on this poject.

Built Mac package shows yellow blank screen and doesn't load properly

I followed the steps on the Readme and got the app to run in the dev mode but when trying to package and run it as an app I get a blank yellow screen with the errors shown below.

I looked into the error and to get around this I had to switch the NODE_ENV to production so I changed the package.json like shown below.

Before

"package": "node package.js",

After

"package": "NODE_ENV=production node package.js",

Doing this got it to work but I'm not sure this is the best approach. Should I be setting the NODE_ENV in the terminal before I build? However, that feels wrong too.

initialState not working

Hey,
I just googled me through the ES6 + React stuff. To set the initialState I just tried using the constructor of the Component like so:

constructor(props) {
    super(props);
    this.state = { focused: false };
  }

And also tried:

constructor(props) {
    super(props);
    this.setState({ focused: false });
  }

Even if I put a simple console.log into the constructor it is not working and the constructor isn't called. What's the matter with this?

Error running npm run start-hot on Windows

C:\Users\x\devel\electron-react-boilerplate> npm run start-hot

[email protected] start-hot C:\Users\x\devel\electron-react-boilerplate
HOT=1 NODE_ENV=development electron .

'HOT' is not recognized as an internal or external command,
operable program or batch file.

npm ERR! Windows_NT 10.0.10240
npm ERR! argv "C:\Program Files\nodejs\node.exe" "C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js" "run" "start-hot"
npm ERR! node v5.0.0
npm ERR! npm v3.3.6
npm ERR! code ELIFECYCLE
npm ERR! [email protected] start-hot: HOT=1 NODE_ENV=development electron .
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] start-hot script 'HOT=1 NODE_ENV=development electron .'.
npm ERR! This is most likely a problem with the electron-react-boilerplate package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! HOT=1 NODE_ENV=development electron .
npm ERR! You can get their info via:
npm ERR! npm owner ls electron-react-boilerplate
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR! C:\Users\x\devel\electron-react-boilerplate\npm-debug.log
PS C:\Users\x\devel\electron-react-boilerplate>

Support package with --all and platform only

https://github.com/moose-team/friends/blob/master/pkg.js as reference

Release fails with electron-packager 5.1.0

Hi,

Releases pacakged with electron-packager 5.1.0 don't run:

Error: Cannot find module '/home/domas/Projects/electron-react-boilerplate/release/linux-x64/ElectronReact-linux-x64/resources/atom.asar/browser/lib/init.js'

But works with 5.0.2. Fixed the problem for me by updating package.json to fixed vesion of electron-packager:
"electron-packager": "=5.0.2"

Not sure yet why 5.1.0 broke

Roadmap

Wait Upstream

support react devtools when electron/electron#915 fixed
change target when webpack/webpack#1467 ship in new release (now only in webpack 2.x).

Investigate

webpack2
electron-updater
electron-compile
~~electron-dl~~

Stuck in "Waiting for update signal from WDS..."

I followed all the installation instructions but I can't get it to hot reload. What could I be doing wrong?

[HMR] Waiting for update signal from WDS...
Download the React DevTools for a better development experience: https://fb.me/react-devtools
[WDS] Disconnected!
[WDS] Hot Module Replacement enabled.

Running on Linux Mint.

Hot loading not working?

First off, thank you so very much for a decent starting point to building a desktop app with React. Much appreciated!

The issue I'm running into is full "page" reloading on changes instead of hot loading. Is this expected behavior, or am I doing something wrong? If this is expected, do you have any plans for implementing hot loading? I'd love to help, if you can point me in the right direction (webpack configuration is something I still haven't gotten the grasp on)

Use of "const" in strict mode

This error occurs on a new install, after cloning the repo, running npm install, and running npm run hot-server.

server.js doesn't seem to be a true JavaScript file, regardless of the .js extension. In addition to the error below, there is a CoffeeScript-like closure using => and string interpolation using backticks. All of these prevent npm run hot-server from running. Is there a dependency not installed with npm install?

/Users/awmartin/Dropbox/Playground/electron-react-boilerplate/server.js:4
const path = require('path');
^^^^^
SyntaxError: Use of const in strict mode.
    at Module._compile (module.js:439:25)
    at Object.Module._extensions..js (module.js:474:10)
    at Module.load (module.js:356:32)
    at Function.Module._load (module.js:312:12)
    at Function.Module.runMain (module.js:497:10)
    at startup (node.js:119:16)
    at node.js:902:3

npm-debug.log.txt

Publishing app to web & electron – preferred approach?

I'm looking to publish my app both to the web, and as a standalone executable.

Is anyone doing this, and if so, care to share your preferred approach? If not, is this something the maintainers are interested in as part of the repo? I'll try to lend a helping hand in the coming weeks if so.

cannot require('electron-prebuilt')

Hi all,

I want to open an external url using shell.openExternal however, when I add const shell = require('electron-prebuilt').shell; I get an error in the dev tools console saying:

Uncaught Error: ENOENT: no such file or directory, open '/path.txt'

I have validated that the path.txt file exists in node_modules/electron-prebuilt. My assumption is that this is something to do with trying to read path.txt whilst in the context of the browser.

Is there some other way of requiring electron-prebuilt?

Firing redux actions from the application menu

What's the preferred way of hooking the application menu into redux? I've implemented undo / redo but am having trouble firing the actions from the menu click. It would be nice to have an example of this included in the repo

enable debug output in browser

Hi,

Have you managed to get debug output in the browser? I somehow can't get it to work.

I've tried window.myDebug = require('debug'). Afaik this should allow me to enable the debug output from the browser console.

I've also tried to set it directly from code window.myDebug.enable('*') and via localStorage.debug="*"

Socket.io warnings

I'm seeing all these warnings. And they also appear in the browser console. Any idea what's causing this? I think this is just the develop branch, not the master...

WARNING in (webpack)-dev-server/~~/socket.io-client/~~/engine.io-client//ws/lib/BufferUtil.js
Module not found: Error: Cannot resolve 'file' or 'directory' ../build/Release/bufferutil in /Users/me/Development/myapp/node_modules/webpack-dev-server/node_modules/socket.io-client/node_modules/engine.io-client/node_modules/ws/lib
@ (webpack)-dev-server//socket.io-client/~~/engine.io-client/~~/ws/lib/BufferUtil.js 8:19-57

WARNING in (webpack)-dev-server/~~/socket.io-client/~~/engine.io-client//ws/lib/BufferUtil.js
Module not found: Error: Cannot resolve 'file' or 'directory' ../build/default/bufferutil in /Users/me/Development/myapp/node_modules/webpack-dev-server/node_modules/socket.io-client/node_modules/engine.io-client/node_modules/ws/lib
@ (webpack)-dev-server//socket.io-client/~~/engine.io-client/~~/ws/lib/BufferUtil.js 10:19-57

WARNING in (webpack)-dev-server/~~/socket.io-client/~~/engine.io-client//ws/lib/Validation.js
Module not found: Error: Cannot resolve 'file' or 'directory' ../build/Release/validation in /Users/me/Development/myapp/node_modules/webpack-dev-server/node_modules/socket.io-client/node_modules/engine.io-client/node_modules/ws/lib
@ (webpack)-dev-server//socket.io-client/~~/engine.io-client/~~/ws/lib/Validation.js 8:19-57

WARNING in (webpack)-dev-server/~~/socket.io-client/~~/engine.io-client//ws/lib/Validation.js
Module not found: Error: Cannot resolve 'file' or 'directory' ../build/default/validation in /Users/me/Development/myapp/node_modules/webpack-dev-server/node_modules/socket.io-client/node_modules/engine.io-client/node_modules/ws/lib
@ (webpack)-dev-server//socket.io-client/~~/engine.io-client/~~/ws/lib/Validation.js 10:19-57
webpack: bundle is now VALID.

Add local eslint to package.json

Every time I start a new project with this boilerplate I am getting the error in Atom, that I have no local eslint installed.

How about adding this as local dependency?

Run tests with babel-register

Webpack bundling duplicate React dependencies?

Burned through a bunch of hours trying to troubleshoot this.. seems to be an issue with the webpack config as far as I can tell. Any help would be greatly appreciated, thanks in advance.

Adding other react modules (ex: react-ui-tree) results in duplicate versions of React which causes invariant violations:

Uncaught Error: Invariant Violation: addComponentAsRefTo(...): Only a ReactOwner can have refs. This usually means that you're trying to add a ref to a component that doesn't have an owner (that is, was not created inside of another component's `render` method). Try rendering this component inside of a new top-level component which will hold the ref.

Very hard to debug but eventually noticed the duplicate React inclusions:

Chads-iMac-5k:electron-react-boilerplate-test Chad$ npm run start-hot

> [email protected] start-hot /Users/Chad/Documents/Work/Dev/electron-react-boilerplate-test
> HOT=1 NODE_ENV=development electron .

[3637:0819/163228:INFO:renderer_main.cc(200)] Renderer process started
[3638:0819/163228:INFO:renderer_main.cc(200)] Renderer process started
[3635:0819/163228:INFO:CONSOLE(60)] "[HMR] Waiting for update signal from WDS...", source: webpack:///(webpack)/hot/dev-server.js? (60)
[3635:0819/163228:INFO:CONSOLE(109)] "Download the React DevTools for a better development experience: https://fb.me/react-devtools", source: webpack:///./~/react/lib/React.js? (109)
[3635:0819/163228:INFO:CONSOLE(109)] "Download the React DevTools for a better development experience: https://fb.me/react-devtools", source: /Users/Chad/Documents/Work/Dev/electron-react-boilerplate-test/node_modules/react/lib/React.js (109)
[3635:0819/163228:INFO:CONSOLE(15)] "[WDS] Hot Module Replacement enabled.", source: webpack:///(webpack)-dev-server/client? (15)

To reproduce:

git clone https://github.com/chentsulin/electron-react-boilerplate.git electron-react-boilerplate-test
cd electron-react-boilerplate-test
npm install
npm install react-ui-tree

Edit app/containers/HomePageContainer.jsx to include:

import React from 'react'
import { Link } from 'react-router'
import { Tree } from 'react-ui-tree'
...

Running..

npm run hot-dev-server
npm run start-hot

Tried many things w/o any success:

Adding new webpack.optimize.DedupePlugin(),
Adding an alias react: path.resolve('./node_modules/react')
Etc

Again, thanks in advance for any help.

Prerender index page to production html

import from react/addons causing double React

I want to use CSSTransitionGroup, which is part of ReactWithAddons, but if I change my imports in the app folder to import React from 'react/addons' I get all kinds of errors because there are two React instances: one directly from filesystem, and one via webpack.

It seems the one from filesystem ([...]node_modules/react/lib/React.js:109) is the one loaded by default and webpack additionally loads ReactWithAddons when i include import React from 'react/addons'.

How can I make sure that just ReactWithAddons is used?

Ignore electron, node's bulit-in and some node_modules which can't build with webpack

Should also ignore something like events, assert ..., and so on in webpack build to get their full function. refer: https://github.com/webpack/node-libs-browser

rebase for bb981068fd

I should rebase for a mistake that commit release into .git

bb98106#commitcomment-11441332

Having issues rendering CSS

I replaced the included app.css file's content with my own CSS rules but they don't seem be to taking effect and I'm not sure why. Any pointers on this issue?

Release app blank window

When I run the package script and launch the osx app, the window is blank. This is for the develop branch. If I do the same on the master branch there is not even a window coming up...

I'm testing this without any of my code involved.

Purpose of index.html file in the project root

This file seems to be pretty useless. Is there any usage of it or it can be safely deleted?

npm run start-hot not working on Windows 10

When running the npm run start-hot it shows the Welcome to Electron screen telling me where to execute my code.

peerDependencies requirements error (history and react-router)

npm ERR! peerinvalid The package [email protected] does not satisfy its siblings' peerDependencies requirements!
npm ERR! peerinvalid Peer [email protected] wants history@^1.17.0

I fixed it by modifying package.json:

    ....
    "history": "^1.17.0", 
    "react-router": "^1.0.2",
    ...

Is it ok? What would you suggest? May be it should be fixed in source code

Default app doesn't work correctly on Windows 8.1?

npm install and npm run hot-server work fine, but npm run start-hot gives me the following error:

[Enhancement] Extra package.json in app folder

First of all, thanks for this great package.

Here's the issue, let's say if I am using this boilerplate to develop my own app, where should I put my own copyright message to my app? Would that be better if the default package.json file only contains all NPM dependencies for necessary packages for developing, building, etc., while leaving the main entry point to another package.json in app folder instead?

For instance, package.json would look like this, and the content of main.js would be in the app folder instead.

./package.json

{
  ...
  "start": "electron app/.",
  "start-dev": "NODE_ENV=development electron app/.",
  ...
}

./app/package.json

{
  "name"    : "your-app",
  "version" : "0.1.0",
  "main"    : "main.js"
}

In that case, it's easier to keep this boilerplate up-to-date, while it doesn't affect the app's own versioning as others develop that.

about static getProps()

I wonder what it the purpose of static getProps()
in AboutPageContainer.jsx and HomePageContainer.jsx

I found nothing on google and there are no calls for that method in code

Requiring native modules

Hi,

I am trying to import a native module like "fs" from a react component, but can't get it to work. Is there anything special I need to do to make it work with babel in your code?

I've tried import fs from 'fs' and let fs = require('fs')

Eventually I want to import node-serialport but it complains that it can't resolve fs so I'm trying to take the first step...

Error: Invalid path './dist/'

iojs 2.0.1

$ npm run hot-server

> [email protected] hot-server xxx
> node server.js

Listening at localhost:3000
xxx/node_modules/webpack-dev-server/node_modules/webpack-dev-middleware/middleware.js:104
      if(err) throw err;
                    ^
Error: Invalid path './dist/'
    at pathToArray (xxx/node_modules/webpack-dev-server/node_modules/webpack-dev-middleware/node_modules/memory-fs/lib/MemoryFileSystem.js:27:38)
    at MemoryFileSystem.mkdirpSync (xxx/node_modules/webpack-dev-server/node_modules/webpack-dev-middleware/node_modules/memory-fs/lib/MemoryFileSystem.js:111:13)
    at MemoryFileSystem.(anonymous function) [as mkdirp] (xxx/node_modules/webpack-dev-server/node_modules/webpack-dev-middleware/node_modules/memory-fs/lib/MemoryFileSystem.js:193:34)
    at Compiler.<anonymous> (xxx/node_modules/webpack/lib/Compiler.js:229:25)
    at Compiler.applyPluginsAsync (xxx/node_modules/webpack/node_modules/tapable/lib/Tapable.js:60:69)
    at Compiler.emitAssets (xxx/node_modules/webpack/lib/Compiler.js:226:7)
    at Watching.<anonymous> (xxx/node_modules/webpack/lib/Compiler.js:54:18)
    at xxx/node_modules/webpack/lib/Compiler.js:403:12
    at Compiler.next (xxx/node_modules/webpack/node_modules/tapable/lib/Tapable.js:67:11)
    at Compiler.<anonymous> (xxx/node_modules/webpack/lib/CachePlugin.js:40:4)

Use electron-prebuilt version for packaging

Is there a reason why this project is always grabbing the latest electron version for packaging? Wouldn't it make more sense to package with the same version as electron-prebuilt?

For example, version 0.31.0 just came out, with some breaking changes, so when I packaged my app it broke.

I started modifying package.js to use the currently-installed version of electron-prebuilt for packaging. I can make a pull request if you're interested.

Upgrade electron to latest version

The electron version currently included in package.json is v0.31.2. It is crashing when used with zeromq. Please upgrade the included version to latest 0.33.0.

Slow refreshing

Hey guys,
I got a problem with hot reloading: when I change something I got to wait >minute for automatic refresh. I can see on the terminal that webpack rebuild the app in ms but I got to manually refresh the view or wait very long time for it.

"electron-prebuilt": "^0.31.2",
"electron-rebuild": "^1.0.0",
"webpack": "^1.12.1",
"webpack-dev-server": "^1.10.1",
"webpack-target-electron-renderer": "^0.1.0"

I run the app with following cmds:

npm run hot-dev-server &
npm run start-hot

The same problem is with css.

Console logs:

[WDS] Disconnected!(anonymous function) @ client:60Emitter.emit @ index.js:134Socket.emit @ socket.js:129Socket.onclose @ socket.js:193module.exports @ index.js:21Emitter.emit @ index.js:134Manager.onclose @ manager.js:433module.exports @ index.js:21Emitter.emit @ index.js:134Socket.onClose @ socket.js:687(anonymous function) @ socket.js:474
client:15 [WDS] Hot Module Replacement enabled.
client:65 [WDS] App hot update...
dev-server.js:55 [HMR] Checking for updates on the server...
log-apply-result.js:20 [HMR] Updated modules:
log-apply-result.js:22 [HMR]  - 279
dev-server.js:41 [HMR] App is up to date.
client:60 [WDS] Disconnected!(anonymous function) @ client:60Emitter.emit @ index.js:134Socket.emit @ socket.js:129Socket.onclose @ socket.js:193module.exports @ index.js:21Emitter.emit @ index.js:134Manager.onclose @ manager.js:433module.exports @ index.js:21Emitter.emit @ index.js:134Socket.onClose @ socket.js:687(anonymous function) @ socket.js:474
client:15 [WDS] Hot Module Replacement enabled.
client:65 [WDS] App hot update...
dev-server.js:55 [HMR] Checking for updates on the server...
log-apply-result.js:20 [HMR] Updated modules:
log-apply-result.js:22 [HMR]  - 279
log-apply-result.js:20 [HMR] Updated modules:
log-apply-result.js:22 [HMR]  - 272
dev-server.js:41 [HMR] App is up to date.
client:60 [WDS] Disconnected!(anonymous function) @ client:60Emitter.emit @ index.js:134Socket.emit @ socket.js:129Socket.onclose @ socket.js:193module.exports @ index.js:21Emitter.emit @ index.js:134Manager.onclose @ manager.js:433module.exports @ index.js:21Emitter.emit @ index.js:134Socket.onClose @ socket.js:687(anonymous function) @ socket.js:474
client:15 [WDS] Hot Module Replacement enabled.
client:65 [WDS] App hot update...
client:60 [WDS] Disconnected!(anonymous function) @ client:60Emitter.emit @ index.js:134Socket.emit @ socket.js:129Socket.onclose @ socket.js:193module.exports @ index.js:21Emitter.emit @ index.js:134Manager.onclose @ manager.js:433module.exports @ index.js:21Emitter.emit @ index.js:134Socket.onClose @ socket.js:687(anonymous function) @ socket.js:474
client:15 [WDS] Hot Module Replacement enabled.
client:65 [WDS] App hot update...

run start-hot breaks chrome refresh(CTRL+R)

Ubuntu Linux 14.04, Chrome 45, after

npm run start-hot

then chrome will not respond to refresh(CTRL+R/F5).

Close Electron App will re-enable chrome refresh functionality.

I did not spot this in other electron app, I was wondering this may related to react-dev or react-hot-loader?

Error in the example app

I need to comment this lines for successful compilation.

Error log:

ERROR in ./app/containers/HomePageContainer.jsx
Module build failed: SyntaxError: /home/user/code/node/TestApp/app/containers/HomePageContainer.jsx: Unexpected token (6:22)
  4 | export default class HomePageContainer extends React.Component {
  5 | 
> 6 |   static defaultProps = {
    |                       ^
  7 |   
  8 |   }
  9 | 
    at Parser.pp.raise (/home/user/code/node/TestApp/node_modules/babel-core/node_modules/babylon/lib/parser/location.js:24:13)
    at Parser.pp.unexpected (/home/user/code/node/TestApp/node_modules/babel-core/node_modules/babylon/lib/parser/util.js:82:8)
    at Parser.pp.parseClassProperty (/home/user/code/node/TestApp/node_modules/babel-core/node_modules/babylon/lib/parser/statement.js:624:61)
    at Parser.parseClassProperty (/home/user/code/node/TestApp/node_modules/babel-core/node_modules/babylon/lib/plugins/flow.js:797:20)
    at Parser.pp.parseClass (/home/user/code/node/TestApp/node_modules/babel-core/node_modules/babylon/lib/parser/statement.js:567:32)
    at Parser.pp.parseExprAtom (/home/user/code/node/TestApp/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:405:19)
    at Parser.parseExprAtom (/home/user/code/node/TestApp/node_modules/babel-core/node_modules/babylon/lib/plugins/jsx/index.js:412:22)
    at Parser.pp.parseExprSubscripts (/home/user/code/node/TestApp/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:236:19)
    at Parser.pp.parseMaybeUnary (/home/user/code/node/TestApp/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:217:19)
    at Parser.pp.parseExprOps (/home/user/code/node/TestApp/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:163:19)
 @ ./app/routes/routes.jsx 21:35-77

ERROR in ./app/containers/AboutPageContainer.jsx
Module build failed: SyntaxError: /home/user/code/node/TestApp/app/containers/AboutPageContainer.jsx: Unexpected token (7:22)
   5 | export default class AboutPageContainer extends React.Component {
   6 | 
>  7 |   static defaultProps = {
     |                       ^
   8 | 
   9 |   }
  10 | 
    at Parser.pp.raise (/home/user/code/node/TestApp/node_modules/babel-core/node_modules/babylon/lib/parser/location.js:24:13)
    at Parser.pp.unexpected (/home/user/code/node/TestApp/node_modules/babel-core/node_modules/babylon/lib/parser/util.js:82:8)
    at Parser.pp.parseClassProperty (/home/user/code/node/TestApp/node_modules/babel-core/node_modules/babylon/lib/parser/statement.js:624:61)
    at Parser.parseClassProperty (/home/user/code/node/TestApp/node_modules/babel-core/node_modules/babylon/lib/plugins/flow.js:797:20)
    at Parser.pp.parseClass (/home/user/code/node/TestApp/node_modules/babel-core/node_modules/babylon/lib/parser/statement.js:567:32)
    at Parser.pp.parseExprAtom (/home/user/code/node/TestApp/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:405:19)
    at Parser.parseExprAtom (/home/user/code/node/TestApp/node_modules/babel-core/node_modules/babylon/lib/plugins/jsx/index.js:412:22)
    at Parser.pp.parseExprSubscripts (/home/user/code/node/TestApp/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:236:19)
    at Parser.pp.parseMaybeUnary (/home/user/code/node/TestApp/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:217:19)
    at Parser.pp.parseExprOps (/home/user/code/node/TestApp/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:163:19)
 @ ./app/routes/routes.jsx 25:36-79

npm package run - Error: Cannot find module 'object-assign'

I'm getting the following error when trying to package the sample application.

I'm running node 4.2.1 and npm 2.14.7.

electron-react-boilerplate|master⚡ ⇒ npm run package              

> [email protected] package /Users/killfish/WebstormProjects/electron-react-boilerplate
> NODE_ENV=production node package.js

module.js:339
    throw err;
    ^

Error: Cannot find module 'object-assign'
    at Function.Module._resolveFilename (module.js:337:15)
    at Function.Module._load (module.js:287:25)
    at Module.require (module.js:366:17)
    at require (module.js:385:17)
    at Object.<anonymous> (/Users/killfish/WebstormProjects/electron-react-boilerplate/package.js:6:14)
    at Module._compile (module.js:435:26)
    at Object.Module._extensions..js (module.js:442:10)
    at Module.load (module.js:356:32)
    at Function.Module._load (module.js:311:12)
    at Function.Module.runMain (module.js:467:10)

npm ERR! Darwin 14.5.0
npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "package"
npm ERR! node v4.2.1
npm ERR! npm  v2.14.7
npm ERR! code ELIFECYCLE
npm ERR! [email protected] package: `NODE_ENV=production node package.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] package script 'NODE_ENV=production node package.js'.
npm ERR! This is most likely a problem with the electron-react-boilerplate package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     NODE_ENV=production node package.js
npm ERR! You can get their info via:
npm ERR!     npm owner ls electron-react-boilerplate
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/killfish/WebstormProjects/electron-react-boilerplate/npm-debug.log

Migrate to react-transform

React Hot Loader is deprecated. see: https://twitter.com/dan_abramov/status/645595855475613697

So should use babel-plugin-react-transform like react-transform-boilerplate does.

Add `.less` support

Need

As a developer
I want to use css preprocessors
So that I'll increase my productivity and DX[Developer Experience]

Solution

add less-loader as dev dependencies
in webpack.config.development.js

{
  test: /\.less$/,
  loader: ['style-loader!css-loader!less-loader']
}

in webpack.config.production.js

{ 
  test: /\.less$/,
  loader: ExtractTextPlugin.extract('style-loader','css-loader!less-loader')
}

Initialize ExtractTextPlugin once

It refers to #62 (comment)

Error: spawn ENOTDIR when packaging application