Angular中使用exec执行bash命令报错TS2307：找不到child_process模块

为什么会出现Cannot find module 'child_process'错误 #

child_process是Node.js专属核心模块，仅能在Node.js运行环境（如后端服务、Electron主进程）中使用。而Angular默认是浏览器端运行的前端框架，浏览器环境没有Node.js的核心API支持，所以即便项目中存在相关文件，也无法在组件（浏览器端代码）中直接调用这个模块，这是环境限制导致的必然报错。

针对不同场景的修复方案 #

场景1：项目是Electron桌面应用 #

Electron的主进程基于Node.js，可直接使用child_process，但Angular组件所在的渲染进程不能直接调用，需通过IPC通信实现：

• 在Electron主进程（main.js）中编写执行bash命令的逻辑，并监听IPC请求：

const { ipcMain } = require('electron');
const { exec } = require('child_process');

ipcMain.handle('execute-bash', async (_, command) => {
  return new Promise((resolve, reject) => {
    exec(command, (error, stdout, stderr) => {
      error ? reject(stderr) : resolve(stdout);
    });
  });
});

• 在Angular组件中通过ipcRenderer向主进程发送请求：

import { Component } from '@angular/core';
const { ipcRenderer } = window.require('electron');

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html'
})
export class AppComponent {
  async runBashCommand() {
    try {
      const output = await ipcRenderer.invoke('execute-bash', 'ls -l');
      console.log(output);
    } catch (err) {
      console.error(err);
    }
  }
}

注意：需在Electron配置中确保开启nodeIntegration，或通过contextBridge安全暴露API。

场景2：项目使用Angular Universal（SSR） #

SSR的服务端代码运行在Node.js环境，可在服务端处理bash命令：

• 在server.ts中添加接口，用于执行命令：

import { exec } from 'child_process';
import { Express } from 'express';

export function app(): Express {
  const server = express();
  // 新增执行命令的接口
  server.get('/api/run-command', (req, res) => {
    const cmd = req.query.cmd as string;
    exec(cmd, (error, stdout, stderr) => {
      error ? res.status(500).send(stderr) : res.send(stdout);
    });
  });
  // 其他SSR配置...
  return server;
}

• Angular组件通过HTTP请求调用该接口：

import { HttpClient } from '@angular/common/http';
import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html'
})
export class AppComponent {
  constructor(private http: HttpClient) {}

  triggerCommand() {
    this.http.get('/api/run-command', { params: { cmd: 'pwd' } })
      .subscribe({
        next: (res) => console.log(res),
        error: (err) => console.error(err)
      });
  }
}

纯浏览器端Angular的替代方案 #

如果是纯浏览器运行的Angular项目，受浏览器安全限制，无法直接执行系统命令，可通过以下方式实现需求：

• 后端代理：搭建一个轻量后端服务（Node.js/Python/Java均可），暴露接口执行bash命令，Angular前端通过HTTP请求调用该接口获取结果
• WebAssembly：使用基于Emscripten编译的Wasm工具实现命令执行，但此方式复杂度高，仅适用于特定场景

内容的提问来源于stack exchange，提问作者jason