在下一步中使用 Nodemailer 时无法解决child_process.js

Question

在其中一个页面/api路由中使用nodemailer会产生以下错误消息：

[ error ] ./node_modules/nodemailer/lib/sendmail-transport/index.js Module not found: Can't resolve 'child_process' in 'C:ua-demonode_modulesnodemailerlibsendmail-transport'

据我所知，next.jspages/api路由仅在服务器环境中运行，因此出现此错误是令人惊讶的。如何解决这一问题，以便我可以向用户发送电子邮件更新？

这里已经在codesandbox.io上添加了一个例子。我认为我们需要直接在本地机器上构建一个程序副本来复制。

Nextjs问题讨论

Answer 1

我已经发现了源代码。当使用Next.js时，所有模块，包括在构建时解析本机服务器资源的NPM包，都需要在仅服务器端的模块中导入。这并不像在通用web应用程序中听起来那么直截了当。

在通用模块中执行类似以下人为示例的操作将导致类似以下错误：Can't resolve 'child_process' in 'C:ua-demonode_modulesnodemailerlibsendmail-transport'，因为child_process是本机服务器资源。

// send-mail/server.js
import nodeMailer from 'nodemailer';
import config from './some/nodemailer/config;
const transport = nodeMailer.createTransport( config );
const sendMail = message => transport.sendMail( message );
export default sendMail;
// send-mail/browser.js
import { post } from 'axios';
const sendMail = async ( axiosRequestConfig ) => {
try {
await post( axiosRequestConfig );
} catch( e ) {
console.error( e );
}
};
export default sendMail;
// send-mail/index.js
import isBrowser from './some/browser/detection/logic';
import browserMailer from './browser';
import serverMailer from './server';
const mailer = isBrowser() ? browserMailer : serverMailer;
export default mailer;

将此"发送邮件"模块导入到您的组件，并相信浏览器检查可确保在运行时具有适当的发送电子邮件逻辑。但是，构建失败，并出现与上面类似的错误。这里的解决方案是修改send-mail模块，将其导入推迟到运行时。

// send-mail/index.js
import dynamic from 'next/dynamic'; // Can also use other lazy-loading module mechanism here. Since we are building a next.js app here, why not use the one created specifically for next apps?
import isBrowser from './some/browser/detection/logic';
const mailer = isBrowser()
? dynamic(() => import( './server' ))
: dynamic(() => import( './browser' ));
export default mailer;

如果使用webpack，我们可以为客户端构建设置RUN_TARGET=BROWSER环境变量，并使用webpack条件加载器在构建时分支代码，而不是动态运行时加载，如所示

// #if process.env.RUN_TARGET !== 'BROWSER'
import serverMailer from './server';
// #endif
// #if process.env.RUN_TARGET === 'BROWSER'
import browserMailer from './browser';
// #endif
let mailer;
// #if process.env.RUN_TARGET !== 'BROWSER'
mailer = serverMailer;
// #endif
// #if process.env.RUN_TARGET === 'BROWSER'
mailer = browserMailer;
// #endif
export default mailer;
// yeilds the following after server-side build
import serverMailer from './server';
let mailer;
mailer = serverMailer;
export default mailer;
// yeilds the following after client-side build
import browserMailer from './browser';
let mailer;
mailer = browserMailer;
export default mailer;

还可以选择删除index.js分支，并在仅服务器端模块中手动导入服务器电子邮件逻辑，在仅浏览器模块中手动导出浏览器电子邮件逻辑。在大型应用程序中，如果不是不可能处理的话，这可能会变得非常麻烦。手动操作是不可取的。

Answer 2

在我的案例中，我导入了一个简单的方法，它似乎只有客户端代码：

import { clientSideMethod } from 'mypackage'

clientSideMethod((位于：

./node_modules/mypackage/dist/utils.js

但错误来自一个完全不同的文件：

Module not found: Can't resolve 'child_process'
error - ./node_modules/mypackage/dist/file.js:8:0

似乎使用通用包导入，遍历下面的所有文件，而不管这些方法是否被实际调用：

import { clientSideMethod } from 'mypackage'

实际上，首先转到包的根并调用：

export * from './file'; // contains server-side code
export * from './utils'; // contains client-side code only

因此触发了错误。解决方案，上面已经提到的一些是：

1. 使用更具体的导入import { clientSideMethod } from '../../node_modules/mypackage/dist/utils'
2. 需要时动态导入服务器端模块
3. 将包或模块拆分为客户端和服务器端

修复起来非常简单，但找到原因却令人沮丧！