Schlechte Erfahrung mit der Migration von Electron-Anwendungen auf ECMAScript-Module

Während ich an meiner Startvorlage für Electron-Anwendungen arbeitete, entschied ich mich, CommonJS-Module vollständig aufzugeben und ausschließlich ECMAScript-Module (im Folgenden ES-Module oder ESM) zu verwenden.

Ich möchte wirklich überall einen einheitlichen Codestil haben. In meinem Projekt wird, wie in vielen anderen, der Quellcode selbst mit ES-Modulen geschrieben, und alles andere (Tests, Konfigurationsdateien, zusätzliche Skripte zum Erstellen) wird mit CommonJS-Modulen geschrieben. Es stört mich sehr und ich möchte, dass alles im gleichen Stil ist - ESM.

Kurz zu modularen Systemen in NodeJS

Seit Version 13 unterstützt NodeJS zwei Modulsysteme:

• CommonJS: Eine Funktion wird verwendet, um ein Modul anzuschließen require()
  
  
  
  .

  
  
  
  
  

• ECMAScript: Ein Schlüsselwort import
  
  
  
  oder eine Funktion wird verwendet, um ein Modul zu verbinden import()
  
  
  
  .

  
  
  
  
  

Es ist wichtig zu wissen:

• Sie können nicht beide require
  
  
  
  und und in derselben Datei verwenden import
  
  
  
  . Entweder der eine oder der andere.

  
  
  
  
  

• In einem ES-Modul können Sie ein anderes ES- oder CommonJS-Modul anschließen.

  
  
  
  
  

• In einem CommonJS-Modul können Sie ausschließlich CommonJS-Module verbinden.

  
  
  
  
  

Wie NodeJS ein System für eine bestimmte Datei auswählt

Hier ist alles einfach. Es gibt zwei Erweiterungen für Dateien: .cjs



und .mjs



die definieren, dass dies ein CommonJS- bzw. ES-Modul ist.

, package.json



type



commonjs



module



- .js



.

Electron

Electron ? main.js



( background.js



) -- , , , , api . , :

const { app, BrowserWindow } = require('electron')

app.whenReady().then(() =>
  new BrowserWindow().loadFile('index.html')
)

app.on('window-all-closed', () => app.quit())
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
    

: .

ESM, package.json



"type": "module"



main.js



:

- const { app, BrowserWindow } = require('electron')
+ import { app, BrowserWindow } from 'electron'
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
    

:

Error [ERR_REQUIRE_ESM]: Must use import to load ES Module
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
    

. electron v12 NodeJS 14.15. ESM .

CommonJS

, electron, , JavaScript . -- require



:

electron /path/to/main.js
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
    

- , electron

require('/path/to/main.js')
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
    

electron CommonJS . main.js



-- ES . CommonJS ES . .

ESM-.

ES - Electron. , - .

, . , ESM CommonJS Electron. nodeJS .cjs



.

, .

JavaScript .js



. , .

tsc



esbuild



, , . .js



.

/ JavaScript .js



. .cjs



.

Vite, , [filename].[hash].cjs



. loader .cjs



. PR ( ) .cjs



JavaScript.

electron-builder

. ES , Vite CommonJS Electron.

, . electron-builder



. :

• electron-builder



read-config-file
  
  
  
  .

  
  
  
  
  

• read-config-file
  
  
  
  CommonJS , require('/path/to/config.js')
  
  
  
  .

  
  
  
  
  

• CommonJS ES .

  
  
  
  
  

, electron-builder



ES .

electron-builder



CommonJS .cjs



. CommonJS .

, .

, read-config-file



.cjs



JavaScript:

if (config.endsWith('.js')) {
    require(config)
} else {
    // ...   ,   JavaScript
}
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
    

PR , .

electron-builder



JavaScript package.json



"type": "module"



.

.js



.json



, .

, , ES .

• eslint. eslint ESM. .

  
  
  
  
  

  -- - require



.eslintrc.js
  
  
  
  . .eslintrc.cjs
  
  
  
  CommonJS.

  
  
  
  
  

  . IDE .eslintrc.cjs
  
  
  
  eslint.

  
  
  
  
  

• -- dotenv
  
  
  
  . ESM, .

  
  
  
  
  

• Jest , ES .

  
  
  
  
  

- , . , , - . . . .