profile
viewpoint
If you are wondering where the data of this site comes from, please visit https://api.github.com/users/johnryan/events. GitMemory does not store any data, but only uses NGINX to cache data for a period of time. The idea behind GitMemory is simply to give users a better reading experience.

johnryan/android-pin 0

An easy drop-in PIN controller for Android

johnryan/beautiful-react-hooks 0

🔥 A collection of beautiful and (hopefully) useful React hooks to speed-up your components and hooks development 🔥

johnryan/fastlane-plugin-appcenter 0

App Center fastlane integration.

johnryan/FDWaveformView 0

Reads an audio file and displays the waveform

johnryan/file-selector 0

Convert a DragEvent or file input to a list of File objects

johnryan/google-libphonenumber 0

The up-to-date and reliable Google's libphonenumber package for node.js.

johnryan/IDMPhotoBrowser 0

Photo Browser / Viewer inspired by Facebook's and Tweetbot's with ARC support, swipe-to-dismiss, image progress and more

johnryan/ios10BarTintDemo 0

Bar tint behavior change in ios 10

johnryan/JsSIP 0

JsSIP, the JavaScript SIP library

johnryan/MBProgressHUD 0

MBProgressHUD + Customizations

issue commentelectron-react-boilerplate/electron-react-boilerplate

Can't use css Id or class to style react component

I had a similar problem in react-electron-boilerplate v2.3.0 as shown below:

export 'default' (imported as 'styles') was not found in './styles.css'

At first, I used this approach to include CSS files:

import styles from './Index.css';

But after probing the .erb/configs folder and the webpack.config.renderer.dev.babel.js file, I realised that there are at least two approaches to include css/scss files:

  1. One is using the postfix: .global. for example, a file named style.global.css. using this way, you just include the file like import 'style.global.css';
  2. The second approach is using module-based importing. just like the above way the community answered before: import styles from './Index.css';

Although the second approach was practical in dev mode, in the production packaging, I got problems and experienced console errors after running the executable app after building and packaging!

So I took a quick look at the webpack.config.renderer.prod.babel.js (the production config) and noticed that this config is pretty different from the dev configurations. and probably it doesn't support the module-based CSS importing!!! I think this could be a flaw in the configs and the electron-react-boilerplate team should pay more attention to this side of the project someday!

Finally, the easiest way I found was changing the prod file: webpack.config.renderer.prod.babel.js

The rules section for CSS part:

{
        test: /\.global\.s?css$/,
        use: [
          {
            loader: MiniCssExtractPlugin.loader,
            options: {
              // `./dist` can't be inerhited for publicPath for styles. Otherwise generated paths will be ./dist/dist
              publicPath: './',
            },
          },
          'css-loader',
          'sass-loader',
        ],
      },
      {
        test: /^((?!\.global).)*\.css$/,
        use: [
          {
            loader: 'style-loader',
          },
          {
            loader: 'css-loader',
            options: {
              modules: {
                localIdentName: '[name]__[local]__[hash:base64:5]',
              },
              sourceMap: true,
              importLoaders: 1,
            },
          },
        ],
      },
tufailra97

comment created time in 4 hours

issue commentelectron-react-boilerplate/electron-react-boilerplate

Dependencies Not Resolved

Prerequisites

  • [ ] Using npm
  • [ ] Using an up-to-date master branch
  • [ ] Using latest version of devtools. Check the docs for how to update
  • [ ] Tried solutions mentioned in #400
  • [ ] For issue in production release, add devtools output of DEBUG_PROD=true yarn build && yarn start

Expected Behavior

Proper installation

Current Behavior

Unresolved dependencies issue

Steps to Reproduce

  1. clone the project
  2. type npm install

Possible Solution (Not obligatory)

This package only browserslist-config-erb@"^0.0.1" had an issue with dependency.

Context

$ npm install npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: restro-pos@undefined npm ERR! Found: electron@11.0.1 npm ERR! node_modules/electron npm ERR! dev electron@"^11.0.1" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer electron@"^7.0.0" from browserslist-config-erb@0.0.1 npm ERR! node_modules/browserslist-config-erb npm ERR! dev browserslist-config-erb@"^0.0.1" from the root project npm ERR! npm ERR! Fix the upstream dependency conflict, or retry npm ERR! this command with --force, or --legacy-peer-deps npm ERR! to accept an incorrect (and potentially broken) dependency resolution. npm ERR! npm ERR! See C:\Users\MD\AppData\Local\npm-cache\eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\MD\AppData\Local\npm-cache_logs\2021-06-19T06_09_46_428Z-debug.log

Your Environment

  • Node version : v15.13.0
  • electron-react-boilerplate version or branch: Master branch@2.3.0
  • Operating System and version: Windows 10
  • Link to your project: It's private

Also, I wonder why you guys only support yarn ? Did you think npm is not worthy? :)

Please give the support for npm as well

I got the below error as well


Why you should do it regularly:
https://github.com/browserslist/browserslist#browsers-data-updating
  • electron-builder  version=22.10.5
  • loaded configuration  file=package.json ("build" field)
  • installing production dependencies  platform=win32 arch=x64 appDir=C:\Users\MD\Desktop\fleksa-pos\src
  ⨯ C:\Program Files\nodejs\node.exe exited with code ERR_ELECTRON_BUILDER_CANNOT_EXECUTE
Output:

Output:

> electron-react-boilerplate@2.3.0 postinstall
> yarn electron-rebuild


Error output:

Error output:
'yarn' is not recognized as an internal or external command,
operable program or batch file.
npm ERR! code 1
npm ERR! path C:\Users\MD\Desktop\fleksa-pos\src
npm ERR! command failed
npm ERR! command C:\Windows\system32\cmd.exe /d /s /c yarn electron-rebuild

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\MD\AppData\Local\npm-cache\_logs\2021-06-19T06_31_53_043Z-debug.log
  stackTrace=
 
                                      Error: C:\Program Files\nodejs\node.exe exited with code ERR_ELECTRON_BUILDER_CANNOT_EXECUTE
 
                                      Output:

                                      Output:
                                 > electron-react-boilerplate@2.3.0 postinstall

                                      > yarn electron-rebuild

                                 Error output:

                                   Error output:
                                      'yarn' is not recognized as an internal or external command,
                                      operable program or batch file.
                                      npm ERR! code 1

                                      npm ERR! path C:\Users\MD\Desktop\fleksa-pos\src
                                npm ERR! command failed

                                      npm ERR! command C:\Windows\system32\cmd.exe /d /s /c yarn electron-rebuild
                                      npm ERR! A complete log of this run can be found in:
                                      npm ERR!     C:\Users\MD\AppData\Local\npm-cache\_logs\2021-06-19T06_31_53_043Z-debug.log

                                          at ChildProcess.<anonymous> (C:\Users\MD\Desktop\fleksa-pos\node_modules\builder-util\src\util.ts:243:14)

                                         at Object.onceWrapper (node:events:476:26)
                                          at ChildProcess.emit (node:events:369:20)

                                          at maybeClose (node:internal/child_process:1067:16)
                                         at Process.ChildProcess._handle.onexit (node:internal/child_process:301:5)
npm ERR! code 1
npm ERR! path C:\Users\MD\Desktop\fleksa-pos
npm ERR! command failed
npm ERR! command C:\Windows\system32\cmd.exe /d /s /c node -r @babel/register .erb/scripts/CheckNativeDep.js && electron-builder install-app-deps && yarn cross-env NODE_ENV=development webpack --config ./.erb/configs/webpack.config.renderer.dev.dll.babel.js && opencollective-postinstall && yarn-deduplicate yarn.lock

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\MD\AppData\Local\npm-cache\_logs\2021-06-19T06_31_53_600Z-debug.log
MohamedJakkariya

comment created time in 15 hours

issue openedelectron-react-boilerplate/electron-react-boilerplate

Dependencies Not Resolved

<!-- Please use the following issue template or your issue will be closed -->

Prerequisites

<!-- If the following boxes are not ALL checked, your issue is likely to be closed -->

  • [ ] Using npm
  • [ ] Using an up-to-date master branch
  • [ ] Using latest version of devtools. Check the docs for how to update
  • [ ] Tried solutions mentioned in #400
  • [ ] For issue in production release, add devtools output of DEBUG_PROD=true yarn build && yarn start

Expected Behavior

Proper installation <!--- What should have happened? -->

Current Behavior

Unresolved dependencies issue <!--- What went wrong? -->

Steps to Reproduce

<!-- Add relevant code and/or a live example --> <!-- Add stack traces -->

  1. clone the project
  2. type npm install

Possible Solution (Not obligatory)

This package only browserslist-config-erb@"^0.0.1" had an issue with dependency.

<!--- Suggest a reason for the bug or how to fix it. -->

Context

$ npm install npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: restro-pos@undefined npm ERR! Found: electron@11.0.1 npm ERR! node_modules/electron npm ERR! dev electron@"^11.0.1" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer electron@"^7.0.0" from browserslist-config-erb@0.0.1 npm ERR! node_modules/browserslist-config-erb npm ERR! dev browserslist-config-erb@"^0.0.1" from the root project npm ERR! npm ERR! Fix the upstream dependency conflict, or retry npm ERR! this command with --force, or --legacy-peer-deps npm ERR! to accept an incorrect (and potentially broken) dependency resolution. npm ERR! npm ERR! See C:\Users\MD\AppData\Local\npm-cache\eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\MD\AppData\Local\npm-cache_logs\2021-06-19T06_09_46_428Z-debug.log

<!--- How has this issue affected you? What are you trying to accomplish? --> <!--- Did you make any changes to the boilerplate after cloning it? --> <!--- Providing context helps us come up with a solution that is most useful in the real world -->

Your Environment

<!--- Include as many relevant details about the environment you experienced the bug in -->

  • Node version : v15.13.0
  • electron-react-boilerplate version or branch: Master branch@2.3.0
  • Operating System and version: Windows 10
  • Link to your project: It's private

<!--- ❗️❗️ Also, please consider donating (https://opencollective.com/electron-react-boilerplate-594) ❗️❗️

Donations will ensure the following:

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

created time in 15 hours

issue closedelectron-react-boilerplate/electron-react-boilerplate

How does the project uses eslint-plugin-react-hooks

Summary

<!-- What do you need help with? -->

I see the project has eslint-plugin-react-hooks and other plugins, but i don't understand how those are used if not imported in the .eslintrc file?

<!--- ❗️❗️ Also, please consider donating (https://opencollective.com/electron-react-boilerplate-594) ❗️❗️

Donations will ensure the following:

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

closed time in a day

codingedgar

issue commentelectron-react-boilerplate/electron-react-boilerplate

How does the project uses eslint-plugin-react-hooks

I believe it's part of the "erb" that .eslintrc.js extends: https://github.com/electron-react-boilerplate/eslint-config-erb

thank you! you're right 👍

codingedgar

comment created time in a day

issue openedelectron-react-boilerplate/electron-react-boilerplate

Disable Prettier?

Summary

Is there an easy way to disable Prettier? I can't deal with its constant harping. I don't necessarily want to disable eslint, but they seem to be integrated.

created time in a day

issue commentelectron-react-boilerplate/electron-react-boilerplate

How does the project uses eslint-plugin-react-hooks

I believe it's part of the "erb" that .eslintrc.js extends: https://github.com/electron-react-boilerplate/eslint-config-erb

codingedgar

comment created time in a day

issue commentelectron-react-boilerplate/electron-react-boilerplate

Hot reload main process

I think at this point you're better off using

https://www.electronforge.io

It's an all-in-one package like react create app that also includes hot reloading.

kenhuang

comment created time in a day

issue commentelectron-react-boilerplate/electron-react-boilerplate

Hot reload main process

@amilajack Can we get this feature in v3.0.0, any chances?

kenhuang

comment created time in a day

issue openedelectron-react-boilerplate/electron-react-boilerplate

How to pass command line arguments to app while running from bash.

Summary

I am running my app from the command line and want to pass command-line arguments in production build as well as when I am running the app in dev mode.

Is there a way to achieve this in the current boilerplate?

Thanks.

created time in 3 days

issue commentelectron-react-boilerplate/electron-react-boilerplate

Problem installing with npm install

I got it work.

I had to update yarn and npm and do a fresh clone of the repo.

BrendonChirume

comment created time in 3 days

issue commentelectron-react-boilerplate/electron-react-boilerplate

Problem installing with npm install

I have an same issue. npm, yarn didn't work for me.

Node : 16.3.0 OS: Big Sur 11.4(sillicon Mac)

BrendonChirume

comment created time in 4 days

pull request commentelectron-react-boilerplate/electron-react-boilerplate

v3.0.0

@amilajack Hi, I would love to see this PR get merged as soon as possible. I'm not a pro JS developer, but is there a way to help out with closing out the remaining items? (I see 3 things under "testing", but it's not clear what each item entails in terms of work needed or its "definition of done")

amilajack

comment created time in 4 days

issue commentelectron-react-boilerplate/electron-react-boilerplate

Problem installing with npm install

Seems like this has been an issue for a while.

npm, pnpm, and yarn did not work for me.

Node: 14.17 Fedora 33

BrendonChirume

comment created time in 4 days

issue openedelectron-react-boilerplate/electron-react-boilerplate

Suggestion to use HashRouter instead of BrowserRouter

<!--- ❗️❗️ Also, please consider donating (https://opencollective.com/electron-react-boilerplate-594) ❗️❗️

Donations will ensure the following:

🔨 Long term maintenance of the project 🛣 Progress on the roadmap 🐛 Quick responses to bug reports and help requests --> As a url in this boilerplate corresponds to a file, using HashRouter seems more favourable over BrowserRouter in App.tsx

If I were to use the exact attribute in a route inside BrowserRouter

    <BrowserRouter>
      <Route exact path="/settings" component={Settings} />
      <Route exact path="/" component={HomePage} />
    </BrowserRouter>

then it wouldn't render either of the routes because the actual url would correspond to a file (ie: src/index.html#/)

whereas the same would work with the exact attrib if we were using HashRouter

    <HashRouter>
      <Route exact path="/settings" component={Settings} />
      <Route exact path="/" component={HomePage} />
    </HashRouter>

created time in 5 days

issue commentelectron-react-boilerplate/electron-react-boilerplate

Problem installing with npm install

I used yarn and it worked

BrendonChirume

comment created time in 5 days

issue commentelectron-react-boilerplate/electron-react-boilerplate

Problem installing with npm install

I am having the same issue

BrendonChirume

comment created time in 5 days

issue commentelectron-react-boilerplate/electron-react-boilerplate

Wrong debugging configuration

@guillemsola It affects Linux (Ubuntu 20.04) users, so I guess it affects Mac users too. I was surprised too when I found out that the issue was closed without solution.

I'm glad my fix worked for you!

stbnps

comment created time in 6 days

issue closedelectron-react-boilerplate/electron-react-boilerplate

Why isn't .css working (instead of .global.css)

Summary

I'm new to React and I'm trying out React with Electron with this boilerplate. In React (create-react-app) when I put import App.css at the top of the code the styles from the CSS file get imported

but in this boilerplate import ./App.css image

import ./App.global.css image

How do I fix? (I may have deleted some files to clean up the workspace, but nothing in the .erb folder.

(Sorry if this is a bad question with an obvious fix by the way)

Edit: yes, i did rename the css files

closed time in 6 days

Shaddwo

issue closedelectron-react-boilerplate/electron-react-boilerplate

loop in Compiling... when run with yarn start and edit a file

hello, i have updated my electron-react-boilerplate version recently, but when i run yarn start, and edit a source file, the console will print Compiling... and Compiled successfully in loop , like this :

i 「wdm」: Compiling... i 「wdm」: Compiled successfully. i 「wdm」: Compiling... i 「wdm」: Compiled successfully. i 「wdm」: Compiling... i 「wdm」: Compiled successfully. i 「wdm」: Compiling... i 「wdm」: Compiled successfully. i 「wdm」: Compiling... i 「wdm」: Compiled successfully. i 「wdm」: Compiling... i 「wdm」: Compiled successfully. i 「wdm」: Compiling... i 「wdm」: Compiled successfully. i 「wdm」: Compiling... i 「wdm」: Compiled successfully. i 「wdm」: Compiling... i 「wdm」: Compiled successfully. i 「wdm」: Compiling...

i chaged webpack config, but just add a less-loader, and a url-loader, the same config in the electron-react-boilerplate ( just template, not add any code) does not exist this problem

closed time in 6 days

nedphae

issue commentelectron-react-boilerplate/electron-react-boilerplate

loop in Compiling... when run with yarn start and edit a file

this is a old old issue, see https://github.com/webpack/watchpack/issues/25 add webpack-mild-compile plugin (https://github.com/yessky/webpack-mild-compile) works for me

nedphae

comment created time in 6 days

issue commentelectron-react-boilerplate/electron-react-boilerplate

Wrong debugging configuration

Hi, I was wondering why this has been closed with no solution

I'm on Windows and I was not able to make debug work for until I put this.

"runtimeArgs": ["start:main", "--inspect=5858", "--remote-debugging-port=9223"],

Maybe this is not affecting those who are on Mac?

stbnps

comment created time in 6 days

issue openedelectron-react-boilerplate/electron-react-boilerplate

Problem installing with npm install

npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: electron-react-boilerplate@undefined npm ERR! Found: electron@11.0.1 npm ERR! node_modules/electron npm ERR! dev electron@"^11.0.1" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer electron@"^7.0.0" from browserslist-config-erb@0.0.1 npm ERR! node_modules/browserslist-config-erb npm ERR! dev browserslist-config-erb@"^0.0.1" from the root project npm ERR! npm ERR! Fix the upstream dependency conflict, or retry npm ERR! this command with --force, or --legacy-peer-deps npm ERR! to accept an incorrect (and potentially broken) dependency resolution. npm ERR! npm ERR! See C:\Users\QWERTY\AppData\Local\npm-cache\eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\QWERTY\AppData\Local\npm-cache_logs\2021-06-13T09_15_21_518Z-debug.log

created time in 6 days

issue openedelectron-react-boilerplate/electron-react-boilerplate

loop in Compiling... when run with yarn start and edit a file

hello, i have updated my electron-react-boilerplate version recently, but when i run yarn start, and edit a source file, the console will print Compiling... and Compiled successfully in loop , like this :

i 「wdm」: Compiling... i 「wdm」: Compiled successfully. i 「wdm」: Compiling... i 「wdm」: Compiled successfully. i 「wdm」: Compiling... i 「wdm」: Compiled successfully. i 「wdm」: Compiling... i 「wdm」: Compiled successfully. i 「wdm」: Compiling... i 「wdm」: Compiled successfully. i 「wdm」: Compiling... i 「wdm」: Compiled successfully. i 「wdm」: Compiling... i 「wdm」: Compiled successfully. i 「wdm」: Compiling... i 「wdm」: Compiled successfully. i 「wdm」: Compiling... i 「wdm」: Compiled successfully. i 「wdm」: Compiling...

i chaged webpack config, but just add a less-loader, and a url-loader, the same config in the electron-react-boilerplate ( just template, not add any code) does not exist this problem

created time in 7 days

issue commentelectron-react-boilerplate/electron-react-boilerplate

Upgrade electron to v13 in boilerplate?

Lol just saw that some upgrades were being implemented in PR #2875 (I didn't realize there was that much complication involved in upgrading the boilerplate). I'll see how that pans out (though an upgrade to v13 still is relevant)

takanuva15

comment created time in 7 days

Pull request review commentelectron-react-boilerplate/electron-react-boilerplate

v3.0.0

+const { contextBridge, ipcRenderer } = require('electron');++contextBridge.exposeInMainWorld('electron', {+  ipcRenderer: {+    send: ipcRenderer.send,+    sendSync: ipcRenderer.sendSync,

Fixed, thanks for the callout!

amilajack

comment created time in 7 days

push eventelectron-react-boilerplate/electron-react-boilerplate

Amila Welihinda

commit sha b8b63904cebd9f4433955cbea75983f0e8393bf9

fix: remove send and sendSync from main process

view details

push time in 7 days

pull request commentelectron-react-boilerplate/electron-react-boilerplate

v3.0.0

Adding on from my last comment I managed to achieve this via these commit diffs. The webpack config for the preload the addition of build:preload the addition of preload in the start process

Keep in mind I haven't bothered working this out for production builds yet, but it's a start.

In my mind simply doing "build:preload": "yarn tsc ./src/main/preload.ts",

feels like it's simply not accounting for a variety of different use cases. I'd suggest implementing a new build config like I have done and adding that in.

amilajack

comment created time in 7 days

issue openedelectron-react-boilerplate/electron-react-boilerplate

Upgrade electron to v13 in boilerplate?

Summary

Hi, thanks for creating this awesome boilerplate! I am trying it now for the first time, but I just realized that it is still using the older electron v11 rather than the newer electron v13 which has been adopted by the electron-quick-start-typescript repo. Can we update the boilerplate to use electron v13? (Or if there's something preventing us from doing it, what is the reason?)

<!--- ❗️❗️ Also, please consider donating (https://opencollective.com/electron-react-boilerplate-594) ❗️❗️

Donations will ensure the following:

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

created time in 7 days

issue commentelectron-react-boilerplate/electron-react-boilerplate

Postinstall script fails, missing path separators

I was also experiencing the same problem. Thanks to @CharukaHS 's solution, I could install and run it successfully.

But I gotta say, after removing the yarn word from the script section of postinstall, and then running the yarn install command, it got installed with success but then after running the yarn start command, I got an error in terminal:

Error when run npm start: Class constructor ServeCommand cannot be invoked without 'new'

But after deleting the whole node_modules folder and then again reinstalling by using the yarn install command, the yarn start command also got fixed and now I can run it with no problem (till now!!!)

CharukaHS

comment created time in 7 days