1

I'm trying to generate a build of our Next.js application that is on a Github repository. We used node 14.19.3 to build the application, and it runs fine on local development.

The package.json of main project is

{
  "name": "example-name",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start"
  },
  "dependencies": {
    "@apollo/client": "^3.6.4",
    "graphql": "^16.5.0",
    "@our-private-package": "^1.0.7",
    "framer-motion": "^2.9.4",
    "i18next": "^21.8.0",
    "js-cookie": "^2.2.1",
    "next": "^12.1.6",
    "next-cookies": "^2.0.3",
    "ni18n": "^1.0.3",
    "prop-types": "^15.7.2",
    "react": "^18.1.0",
    "react-dom": "^18.1.0",
    "react-ga": "^3.3.0",
    "react-i18next": "^11.16.9",
    "react-icons": "^4.3.1",
    "react-modal": "^3.11.2",
    "react-redux": "^7.2.1",
    "react-slick": "^0.27.11",
    "react-slider": "^2.0.1",
    "redux": "^4.0.5",
    "redux-thunk": "^2.3.0",
    "sass": "^1.26.11",
    "slick-carousel": "^1.8.1"
  },
  "devDependencies": {
    "@ermeschultz/chai-arrays": "^2.3.0",
    "chai": "^4.2.0",
    "eslint": "^7.2.0",
    "eslint-config-prettier": "^6.11.0",
    "eslint-plugin-import": "^2.22.0",
    "eslint-plugin-jsx-a11y": "^6.3.1",
    "eslint-plugin-prettier": "^3.1.4",
    "eslint-plugin-react": "^7.20.6",
    "eslint-plugin-react-hooks": "^4.0.0",
    "esm": "^3.2.25",
    "file-loader": "^6.1.0",
    "mocha": "^8.1.3",
    "prettier": "^2.1.1",
    "redux-devtools-extension": "^2.13.8",
    "redux-logger": "^3.0.6",
    "url-loader": "^4.1.0"
  }
}

Our private package have this package.json file:

{
  "name": "@our-private-package",
  "version": "1.0.7",
  ...
  "engines": {
    "yarn": ">=1.22.0",
    "npm": ">=6.14.16",
    "node": ">=14"
  },
  "scripts": {
    "prepare": "npm run build",
    "start": "node ./build/index.js",
    "dev": "ts-node ./src/index.ts",
    "build": "tsc --module commonjs"
  },
  "dependencies": {
    "canvas": "^2.9.1",
    "canvas-5-polyfill": "^0.1.5"
  },
  "devDependencies": {
    "@types/node": "^17.0.33",
    "@types/react": "^17.0.39",
    "@types/react-dom": "^17.0.3",
    "react": "^17.0.0",
    "react-dom": "^17.0.0",
    "ts-node": "^10.7.0",
    "typescript": "^4.6.4"
  },
  "peerDependencies": {
    "react": "^17.0.0",
    "react-dom": "^17.0.0"
  }
}

To create the service, I selected nodejs 14 platform and put these build commands in the app runner user interface:

export VARIABLE=value; npm install; npm run build

*The variable is an env variable necessary to import some private packages.

And this running commands in the app runner user interface:

npm start

The build logs show the message:

  "[Build] \u001b[0m\u001b[91mError: The module '/app/node_modules/canvas/build/Release/canvas.node'\n",
  "[Build] was compiled against a different Node.js version using\n",
  "[Build] NODE_MODULE_VERSION 72. This version of Node.js requires\n",
  "[Build] NODE_MODULE_VERSION 83. Please try re-compiling or re-installing\n",

I removed the private package and then project builds successfully on app runner. But I just can't reproduce the same problem on my local machine.

The error on message was reported previously on Stack Overflow, always relating to the use of another version of node than the current used one. It is always solved by reinstalling, rebuilding, and/or clearing the npm cache. But app runner creates the container from scratch.

The interface shows that we are using Node js 14 environment. But it seems running on the Node js 12 platform when running npm run build command. At least for the canvas module build.

It could be a package conflict case. But, why this shows the message like it was build in node 12? Why the same problem does not happens in my local development even if I'm using same node and npm present in App Runner?

Erme Schultz
  • 319
  • 5
  • 17
  • 1
    would be good to paste the `package.json` - maybe there is conflict in one of your dependencies? – serraosays May 26 '22 at 21:10
  • Thanks for the point @serraosays. I try remove the private package, and app runs fine. It really look conflict in dependencies (maybe different react versions). But I reformulate the question to understanding why it looks trying building on node 12 on app runner instead node 14 (even if node 14 is selected as platform...). In my development settings it builds and works correctly (or i think it does). – Erme Schultz May 27 '22 at 10:49
  • 1
    Your `package.json` looks good. Another thing I'd check is that sometimes you have to set the Node version via CLI/GUI for AWS invocations. For example, I use Lambdas and for whatever reason it defaults to 12.x instead of 14. So I had to set the node version flag for the service. Maybe something similar exists for app runner? – serraosays May 27 '22 at 18:42
  • I tried both on AWS GUI and also using apprunner.yaml, and the problem persisted with npm. But, I tried another thing: run with yarn (`yarn install; yarn build`) and it worked! Maybe our team injected inconsistency in installation by using two different tools? – Erme Schultz May 30 '22 at 12:07
  • Maybe `yarn` wasn't getting called by app runner? – serraosays May 31 '22 at 18:07

1 Answers1

0

It is not a definitive complete answer to the question, but run yarn install; yarn build instead npm make the same code runs on app runner.

Erme Schultz
  • 319
  • 5
  • 17