从反应组件调用节点模块

Posted 2023-02-19

【中文标题】从反应组件调用节点模块

【英文标题】：Invoking a node module from react component

【发布时间】：2017-05-01 14:02:36

【问题描述】：

如何在 React 组件中使用节点模块，例如“lwip”？这是一个电子应用程序。

用代码更新问题：

这是我尝试从中调用另一个 .js 文件的反应组件。

button.js

import React from 'react';
import ReactDOM from 'react-dom';
import resize from '../../node-code/process';

class Button extends React.Component

    mess()
        console.log('working');
        resize();
    

    render()
        return <button id="imgButton" onClick=this.mess.bind(this)>Upload Image</button>
    


export default Button

这是我尝试调整图像大小的另一个 javascript 文件。

process.js

var lwip = require('lwip');

export default function()
    var lwip = require('lwip');
    lwip.open('../../public/img/portrait.jpg', function(err, image)


    image.batch()
        .scale(0.75)          // scale to 75%
        .rotate(45, 'white')  // rotate 45degs clockwise (white fill)
        .crop(200, 200)       // crop a 200X200 square from center
        .blur(5)              // Gaussian blur with SD=5
        .writeFile('../../public/img/output.jpg', function(err)

        );

    );

【问题讨论】：

欢迎堆砌！这个问题需要一些工作。您是否遇到任何错误？

还没有错误，但我需要知道调用节点模块中的方法的过程。我正在编写一个需要处理图像的电子应用程序，所以我安装了 lwip 节点模块如何使用反应组件中的方法？有没有教程可以指导我完成？

喜欢... var lwip = require('lwip'); lwip.method() ?

这个是用在electron的main.js（主进程）还是react组件类中？

您可以在任何需要的地方使用它

【参考方案1】：

Node 模块需要从主 Electron 线程运行，而不是运行 React 的渲染器线程。

您可以在渲染器进程中运行 NPM 模块，就像在浏览器中一样，但是这些模块不能使用 Node.js 库，因为浏览器中显然没有 Node。

要在主（节点）和渲染器（浏览器）线程之间进行通信，您需要使用 IPC（进程间通信）一个使用事件在线程之间发送数据的系统。

Here's the IPC documentation for Electron.

如果您需要线程之间的持续通信，您可以使用electron-ipc-socket 库。