无论我怎么尝试，都无法导入Angular Typescript模块中的Node、JS或电子库

npm install @types/node --save-dev

npm install electron --save
npm install @types/electron --save-dev

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "lib": ["es2015", "dom"],
    "types": ["node", "electron"]
  }
}

import * as fs from 'fs';

fs.readFile('/path/to/file', 'utf8', (err, data) => {
  if (err) {
    console.error(err);
    return;
  }
  console.log(data);
});

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

function createWindow() {
  const win = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      preload: path.join(__dirname, 'preload.js')
    }
  });

  win.loadURL('http://localhost:4200'); // 假设 Angular 应用在 localhost:4200 运行
}

app.on('ready', createWindow);

const { contextBridge, ipcRenderer } = require('electron');

contextBridge.exposeInMainWorld('electron', {
  ipcRenderer: ipcRenderer
});

import { Component, OnInit } from '@angular/core';

declare global {
  interface Window {
    electron: any;
  }
}

@Component({
  selector: 'app-example',
  templateUrl: './example.component.html',
  styleUrls: ['./example.component.css']
})
export class ExampleComponent implements OnInit {
  constructor() {}

  ngOnInit(): void {
    if (window.electron) {
      window.electron.ipcRenderer.send('message', 'Hello from Angular');
    }
  }
}

const path = require('path');

module.exports = {
  target: 'electron-renderer',
  resolve: {
    extensions: ['.ts', '.js'],
    alias: {
      fs: path.resolve(__dirname, 'node_modules/fs')
    }
  }
};

npm install @angular-builders/custom-webpack --save-dev

"architect": {
  "build": {
    "builder": "@angular-builders/custom-webpack:browser",
    "options": {
      "customWebpackConfig": {
        "path": "./extra-webpack.config.js"
      }
    }
  }
}

module.exports = {
  target: 'electron-renderer'
};