CODEWITHSUNDEEP
webpacknext.jsaws-amplify
Stranger
Stranger

Reputation: 107

AWS Amplify - Module not found: Error: Can't resolve 'bufferutil'

I have a problem with deployin Next.js application on AWS Amplify. While building at the "Starting SRR Build..." moment it throws this:

2022-03-18T21:40:34.115Z [INFO]: Starting SSR Build...
2022-03-18T21:43:42.138Z [ERROR]: Error: Command failed with exit code 1: node_modules/.bin/next build
Failed to compile.
ModuleNotFoundError: Module not found: Error: Can't resolve 'bufferutil' in '/codebuild/output/src274598471/src/proj/node_modules/ws/lib'
> Build error occurred
Error: > Build failed because of webpack errors
at /codebuild/output/src274598471/src/proj/node_modules/next/dist/build/index.js:15:924
at async Span.traceAsyncFn (/codebuild/output/src274598471/src/proj/node_modules/next/dist/telemetry/trace/trace.js:6:584)
info  - Using webpack 5. Reason: Enabled by default https://nextjs.org/docs/messages/webpack5
info  - Checking validity of types...
info  - Creating an optimized production build...
at makeError (/root/.//node_modules/execa/lib/error.js:60:11)
at handlePromise (/root/.//node_modules/execa/index.js:118:26)
at processTicksAndRejections (internal/process/task_queues.js:95:5)
at async Builder.build (/root/.//node_modules/@sls-next/lambda-at-edge/dist/build.js:377:13)
at async NextjsComponent.build (/root/.//node_modules/@sls-next/-component/dist/component.js:165:13)
at async NextjsComponent.default (/root/.//node_modules/@sls-next/-component/dist/component.js:22:13)
at async fn (/root/.npm/_npx/1924/lib/node_modules//node_modules/@/template/utils.js:280:41)
at async Promise.all (index 0)
at async executeGraph (/root/.npm/_npx/1924/lib/node_modules//node_modules/@/template/utils.js:294:3)
at async Template.default (/root/.npm/_npx/1924/lib/node_modules//node_modules/@/template/.js:67:38)
at async Object.runComponents (/root/.npm/_npx/1924/lib/node_modules//node_modules/@/cli/src/index.js:222:17) {
shortMessage: 'Command failed with exit code 1: node_modules/.bin/next build',
command: 'node_modules/.bin/next build',
escapedCommand: '"node_modules/.bin/next" build',
exitCode: 1,
signal: undefined,
signalDescription: undefined,
stdout: 'info  - Using webpack 5. Reason: Enabled by default https://nextjs.org/docs/messages/webpack5\n' +
'info  - Checking validity of types...\n' +
'info  - Creating an optimized production build...',
stderr: 'Failed to compile.\n' +
'\n' +
"ModuleNotFoundError: Module not found: Error: Can't resolve 'bufferutil' in '/codebuild/output/src274598471/src/proj/node_modules/ws/lib'\n" +
'\n' +
'\n' +
'> Build error occurred\n' +
'Error: > Build failed because of webpack errors\n' +
'    at /codebuild/output/src274598471/src/proj/node_modules/next/dist/build/index.js:15:924\n' +
'    at async Span.traceAsyncFn (/codebuild/output/src274598471/src/proj/node_modules/next/dist/telemetry/trace/trace.js:6:584)',
failed: true,
timedOut: false,
isCanceled: false,
killed: false
}

Somewhere in the Internet I've found that for some people worked adding externals to next.config.js but for me it didn't.

my next.config.js:

const { i18n } = require('./next-i18next.config');
const path = require('path')

module.exports = {
  reactStrictMode: true,
  i18n,
  eslint: {
    // Warning: This allows production builds to successfully complete even if
    // your project has ESLint errors.
    ignoreDuringBuilds: true,
  },
  externals: [/node-modules/, 'bufferutil', 'utf-8-validate']
}

I would be grateful for any kind of help.

Upvotes: 0

Views: 3176

Answers (3)

Dominik Myszkowski
Dominik Myszkowski

Reputation: 302

The question is pretty old, but maybe it will help others too. The problem is not only with AWS, but also with Twilio and probably other libs as well. Out of the box NextJS will try to compile and render even the client-side components on NextJS 13. Anyway the problem is usually with "bufferutil" and "utf-8-validate".

The solution is to modify next.config.js file to use externals lib when on server.

So:

npm install webpack-node-externals --save-dev

And in next.config.js add property:

const nodeExternals = require('webpack-node-externals')

const nextConfig = {
  //...,
  webpack: (config, { isServer }) => {
    if (isServer) {
      config.externals = nodeExternals();
    }
    return config;
  },
}

Upvotes: 2

Manoj Gupta
Manoj Gupta

Reputation: 474

// add below property in webpack.config.js

externals: {
      bufferutil: "bufferutil",
      "utf-8-validate": "utf-8-validate",
    }

Upvotes: 2

Samuel Robert
Samuel Robert

Reputation: 11032

Try setting the below environment variable to true in the Amplify console app's environment variable section:

AMPLIFY_NEXTJS_EXPERIMENTAL_TRACE true

Upvotes: 1

Related Questions