Building my electron app and running it at the same time?

Question

My first look around I wasn't able to find an answer on here to my specific case. I am using react, tailwind, typescript, electron, with parcel.

I am new to this stack so it took me ages to even get the stack running together smoothly. My question is currently how my package.json is setup every time I change something in the code I have to build it then run it for it to reflect the changes. Can I change my package.json to do this all together or is there some sort of plugin I can use or script I can write to automate that?

My package.json:

    {
  "name": "electron-typescript-starter",
  "version": "1.0.0",
  "main": "index.js",
  "author": "Huy",
  "license": "BSD-2-Clause",
  "dependencies": {
    "@types/react": "^16.9.2",
    "@types/react-dom": "^16.8.5",
    "electron": "^6.0.2",
    "parcel-bundler": "^1.12.3",
    "react": "^16.9.0",
    "react-dom": "^16.9.0",
    "tailwindcss": "^1.1.2"
  },
  "scripts": {
    "dev": "parcel ./index.html",
    "app": "electron electron.js",
    "dist": "parcel build ./index.html",
    "watch": "parcel watch ./index.html --public-url ./ --target=electron-renderer"
  },
  "devDependencies": {
    "sass": "^1.22.10",
    "typescript": "^3.5.3"
  }
}

score 0 · Answer 1 · answered Apr 14 '21 at 02:27

Not sure if this is best practice but the way I was able to make this work was using something called concurrently which allows you to execute multiple arguments in one script.

"start": "concurrently \"parcel watch ./index.html --public-url ./ --target=electron-renderer\" \"electron electron.js\""

Building my electron app and running it at the same time?

1 Answers1