Doesn't work with electron-forge / electron 24.1.2 about electron-store HOT 4 OPEN

The docs seem to be out of date as you can't create a store in the renderer process anymore. Everything works great if I only create my store in the main process and use IPC to communicate. Electron React Boilerplate project has some useful docs on this.

https://electron-react-boilerplate.js.org/docs/electron-store

from electron-store.

My solution was to make a super simple version of electron-store that works for my needs. At the time of this writing electron-store doesn't work with apps packaged with electron-forge, or at least it didn't work for me. I made a gist of what I did for anyone having this problem: https://gist.github.com/steve981cr/499dae0c2a4c6340d0f35656dae92020

from electron-store.

I ran into the same issue.

• I get the error when packaging the app with Electron-Forge in Windows. This is Electron's recommended Packager.
• I do not get the error on Mac.
• I do not get the error on Windows if I use the Electron-Builder packager.
• I have isolated the error to be caused if I use Electron Store. If I just comment out the use of it, the error goes away. And interestingly, if I use electron-settings instead of Electron-Store (they perform a similar function) I get the same type of error.

Attached is a screenshot of the error message I get.

from electron-store.

After some research, i found a solution:

1. Need to add in main webpack config target: "electron-main",

import type {Configuration} from 'webpack';

import {rules} from './webpack.rules';
import {plugins} from './webpack.plugins';

export const mainConfig: Configuration = {
    entry: './src/index.ts',
    target: "electron-main", // <-- PUT IT HERE
    module: {
        rules,
    },
    plugins,
    resolve: {
        extensions: ['.js', '.ts', '.jsx', '.tsx', '.css', '.json'],
    },
};

2. Need to add in renderer webpack config target: "electron-renderer",

import type { Configuration } from 'webpack';

import { rules } from './webpack.rules';
import { plugins } from './webpack.plugins';

rules.push({
  test: /\.css$/,
  use: [{ loader: 'style-loader' }, { loader: 'css-loader' }],
});

export const rendererConfig: Configuration = {
  target: "electron-renderer", // <-- PUT IT HERE
  module: {
    rules,
  },
  plugins,
  resolve: {
    extensions: ['.js', '.ts', '.jsx', '.tsx', '.css'],
  },
};

from electron-store.