Skip to main content
When creating a Native Desktop application, it is recommended to follow a structured directory layout to keep your project organized and maintainable. The proposed structure is as follows: 
.
+-- assets                                    [Directory]
|   +-- icons                                 [Directory]
|       +-- linux.png                         [File]
|       +-- mac.icns                          [File]
|       +-- windows.ico                       [File]
+-- html                                      [Directory]
|   +-- not-allowed.html                      [File]
|   +-- offline.html                          [File]
|   +-- splash-screen.html                    [File]
+-- src                                       [Directory]
|   +-- mainPluginSample.ts                   [File]
|   +-- rendererPluginSample.ts               [File]
+-- .gitignore                                [File]
+-- .prettierrc                               [File]
+-- package.json                              [File]
+-- native-desktop.config.json5               [File]
+-- staging.native-desktop.config.json5       [File]
+-- production.native-desktop.config.json5    [File]
+-- eslint.config.mjs                         [File]
+-- tsconfig.json                             [File]

​
Directory & File Description

  • assets/icons: Contains platform-specific icons for your application:
    • linux.png: Icon for Linux builds
    • mac.icns: Icon for macOS builds
    • windows.ico: Icon for Windows builds
  • html: Contains HTML pages used by the application in specific states:
    • not-allowed.html: Displayed when a page cannot be loaded or is disallowed
    • offline.html: Shown when the application is offline
    • splash-screen.html: Shown during the loading state of the application
  • src: Contains your custom Native Desktop plugin code:
    • mainPluginSample.ts: Sample main process plugin
    • rendererPluginSample.ts: Sample renderer process plugin
  • .gitignore: Specifies files and directories to exclude from version control
  • .prettierrc: Configuration for Prettier code formatting
  • package.json: Node.js project configuration and dependencies
  • native-desktop.config.json5: Default Native Desktop configuration file for development
  • staging.native-desktop.config.json5: Optional configuration for staging environment
  • production.native-desktop.config.json5: Optional configuration for production environment
  • eslint.config.mjs: ESLint configuration file for linting rules
  • tsconfig.json: TypeScript configuration file
Following this structure ensures your Native Desktop project is well-organized, scalable, and easy to maintain, making development and deployment more efficient.