Webpack does not work with native dependencies.

[Sam Hoque]

ts-node .erb/scripts/check-native-dep.js && electron-builder install-app-deps && npm run build:dll

Webpack does not work with native dependencies.
flowbite-react is a native dependency and should be installed inside of the "./release/app" folder.
First, uninstall the packages from "./package.json":
npm uninstall your-package
Then, instead of installing the package to the root "./package.json":
npm install your-package
Install the package to "./release/app/package.json"
cd ./release/app && npm install your-package
Read more about native dependencies at:
https://electron-react-boilerplate.js.org/docs/adding-dependencies/#module-structure

[Leo Hui]

does your module use in renderer or main?

native dependencies works with main process.

[Leo Hui]

and flowbite-react is looks like a UI framework, it has native dependency?

[Sam Hoque]

I am using it in the renderer

[Sam Hoque]

Yes, its an UI Library thats why I am confused on the error.

[Taejin Kim]

@SamHoque

Hi, I encountered a similar issue where a native package wasn't working as expected(other package. not yours). To resolve this, I installed the native-addon-loader package as a devDependency in the root package.json and modified the webpack files. Below is the relevant code:

// webpack.config.main.prod.ts
// and
// webpack.config.renderer.dev.ts

{
  ...
  module: {
    ...
    rules: [
      {
        test: /\.node$/,
        use: 'native-addon-loader',
      },
    ],
  },
  resolve: {
    extensions: ['.js', '.jsx', '.ts', '.tsx', '.json', '.node'],
  },
}

By adding this configuration to both webpack.config.main.prod.ts and webpack.config.renderer.dev.ts, the commands npm run start and npm run package now work well.

I hope this experience proves helpful.