Install NodeJS, Microsoft Visual Studio Build Tools 17 and Python 2.7.
After that, launch CMD.exe, enter in the project folder and launch
cd native_module && npm install && npm run build
cd .. && cd electron_sample && npm install && npm run build
npm run start
After the start
task, the native string world
will appear inside the DOM of an Electron window.
The application is split in two parts:
electron_sample
: a sample application running in Electron using a Typescript Webpack bundled renderer.native_module
: a sample Typescript module that integrates a native feature.
In order to display the sample string generated by the module in the Electron application, we need to inject it into the application itself.
The application main treat is to generate an Electron application and to include the native_module
.
The assets file are already moved in the dist
folder and webpack is configured to build the bundle inside that folder.
The application package.json
just includes the local path in his dependencies.
"dependencies": {
"native_module": "file:../native_module"
}
devDependencies
are included to compile and run correctly the application.
In our scripts
we have:
start
task, to launch the application.build
task, to compile and pack Typescript and Javascript files.
First of all, let's consider the tsconfig.json
file. Using:
"declaration": true,
"outDir": "dist"
the Typescript compiler will use dist
as the build directory and will generate declarations.
In the package.json
"main": "dist/index.js",
"types": "dist/index.d.ts"
indicates the correct path for the main file and typing declarations.
The scripts used in this module are
"build": "tsc",
"build-native": "node-gyp rebuild"
build-native
: compiles the C++ code.build
: compiles the ts code.
In order to develop using a native library, we need node-gyp
. @types/node
and typescript
are useful to compile Typescript.
"devDependencies": {
"@types/node": "^20.6.3",
"node-gyp": "^9.4.0",
"typescript": "^5.2.2"
}
In Typescript index.ts
is wrapped the exported hello
function used in the Electron application.