Skip to content

billo32/electron-react-tailwind-js

Repository files navigation

Electron Boilerplate with React 18, Tailwind and JS

This is simple template (boilerplate) for your first Electron.js app. Made with electron-forge.

  • React@18.2.0
  • Electron-forge@6.4.2
  • Tailwindcss@3.3.5

Install & run

  1. git clone https://github.com/billo32/electron-react-tailwind-js.git my-app
  2. cd my-app
  3. npm install
  4. npm start

Build APP

Open teminal and do (it will make app for same platform like your current machine). For more check instruction

npx electron-forge package
npx electron-forge make
npx electron-forge publish

After this check /out dir

Issues

HTTP requests & CORS

If you going to do some HTTP request from useEffect (actually thats incorrect way, but ok...), you probably will get some CORS issue.

For fix, you can use this workaround https://stackoverflow.com/a/70137354

Put next string

devContentSecurityPolicy: "connect-src 'self' https://some_url.com 'unsafe-eval'",

in forge.config.js

    ...
    {
      name: "@electron-forge/plugin-webpack",
      config: {
        mainConfig: "./webpack.main.config.js",
        devContentSecurityPolicy:
          "connect-src 'self' https://jsonplaceholder.typicode.com 'unsafe-eval'",
        renderer: {
          config: "./webpack.renderer.config.js",
          entryPoints: [
            {
              html: "./src/index.html",
              js: "./src/renderer.js",
              name: "main_window",
              preload: {
                js: "./src/preload.js",
              },
            },
          ],
        },
      },
    },
    ...