search

Automattic / node-canvas

Node canvas is a Cairo backed Canvas implementation for NodeJS.
10.14k stars 1.17k forks source link

404 error on getting canvas 2.10.2 musl #2153

Closed kirill-martynov closed 1 year ago

kirill-martynov commented 1 year ago

Issue

Can't get canvas, getting 404 error

error /app/node_modules/canvas: Command failed.
Exit code: 1
Command: node-pre-gyp install --fallback-to-build --update-binary
Arguments: 
Directory: /app/node_modules/canvas
Output:
node-pre-gyp info it worked if it ends with ok
node-pre-gyp info using node-pre-gyp@1.0.10
node-pre-gyp info using node@14.19.3 | linux | x64
node-pre-gyp http GET https://github.com/Automattic/node-canvas/releases/download/v2.10.2/canvas-v2.10.2-node-v83-linux-musl-x64.tar.gz
node-pre-gyp ERR! install response status 404 Not Found on https://github.com/Automattic/node-canvas/releases/download/v2.10.2/canvas-v2.10.2-node-v83-linux-musl-x64.tar.gz 
node-pre-gyp WARN Pre-built binaries not installable for canvas@2.10.2 and node@14.19.3 (node-v83 ABI, musl) (falling back to source compile with node-gyp) 
node-pre-gyp WARN Hit error response status 404 Not Found on https://github.com/Automattic/node-canvas/releases/download/v2.10.2/canvas-v2.10.2-node-v83-linux-musl-x64.tar.gz 
gyp info it worked if it ends with ok
gyp info using node-gyp@5.1.0
gyp info using node@14.19.3 | linux | x64
gyp info ok 
gyp info it worked if it ends with ok
gyp info using node-gyp@5.1.0
gyp info using node@14.19.3 | linux | x64
gyp ERR! find Python 
gyp ERR! find Python Python is not set from command line or npm configuration
gyp ERR! find Python Python is not set from environment variable PYTHON
gyp ERR! find Python checking if "python" can be used
gyp ERR! find Python - "python" is not in PATH or produced an error
gyp ERR! find Python checking if "python2" can be used
gyp ERR! find Python - "python2" is not in PATH or produced an error
gyp ERR! find Python checking if "python3" can be used
gyp ERR! find Python - "python3" is not in PATH or produced an error
gyp ERR! find Python 
gyp ERR! find Python **********************************************************
gyp ERR! find Python You need to install the latest version of Python.
gyp ERR! find Python Node-gyp should be able to find and use Python. If not,
gyp ERR! find Python you can try one of the following options:
gyp ERR! find Python - Use the switch --python="/path/to/pythonexecutable"
gyp ERR! find Python   (accepted by both node-gyp and npm)
gyp ERR! find Python - Set the environment variable PYTHON
gyp ERR! find Python - Set the npm configuration variable python:
gyp ERR! find Python   npm config set python "/path/to/pythonexecutable"
gyp ERR! find Python For more information consult the documentation at:
gyp ERR! find Python https://github.com/nodejs/node-gyp#installation
gyp ERR! find Python **********************************************************
gyp ERR! find Python 
gyp ERR! configure error 
gyp ERR! stack Error: Could not find any Python installation to use
gyp ERR! stack     at PythonFinder.fail (/usr/local/lib/node_modules/npm/node_modules/node-gyp/lib/find-python.js:307:47)
gyp ERR! stack     at PythonFinder.runChecks (/usr/local/lib/node_modules/npm/node_modules/node-gyp/lib/find-python.js:136:21)
gyp ERR! stack     at PythonFinder.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/node-gyp/lib/find-python.js:1[79](https://gitlab.com/edstein-lms/lms-ts/-/jobs/3256796155#L79):16)
gyp ERR! stack     at PythonFinder.execFileCallback (/usr/local/lib/node_modules/npm/node_modules/node-gyp/lib/find-python.js:271:16)
gyp ERR! stack     at exithandler (child_process.js:390:5)
gyp ERR! stack     at ChildProcess.errorhandler (child_process.js:402:5)
gyp ERR! stack     at ChildProcess.emit (events.js:400:28)
gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:283:12)
gyp ERR! stack     at onErrorNT (internal/child_process.js:472:16)
gyp ERR! stack     at processTicksAndRejections (internal/process/task_queues.js:[82](https://gitlab.com/edstein-lms/lms-ts/-/jobs/3256796155#L82):21)
gyp ERR! System Linux 5.4.0-121-generic
gyp ERR! command "/usr/local/bin/node" "/usr/local/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "configure" "--fallback-to-build" "--update-binary" "--module=/app/node_modules/canvas/build/Release/canvas.node" "--module_name=canvas" "--module_path=/app/node_modules/canvas/build/Release" "--napi_version=8" "--node_abi_napi=napi" "--napi_build_version=0" "--node_napi_label=node-v[83](https://gitlab.com/edstein-lms/lms-ts/-/jobs/3256796155#L83)"
gyp ERR! cwd /app/node_modules/canvas
gyp ERR! node -v v14.19.3
gyp ERR! node-gyp -v v5.1.0
gyp ERR! not ok 
node-pre-gyp ERR! build error 
node-pre-gyp ERR! stack Error: Failed to execute '/usr/local/bin/node /usr/local/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js configure --fallback-to-build --update-binary --module=/app/node_modules/canvas/build/Release/canvas.node --module_name=canvas --module_path=/app/node_modules/canvas/build/Release --napi_version=8 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v83' (1)
node-pre-gyp ERR! stack     at ChildProcess.<anonymous> (/app/node_modules/@mapbox/node-pre-gyp/lib/util/compile.js:89:23)
node-pre-gyp ERR! stack     at ChildProcess.emit (events.js:400:28)
node-pre-gyp ERR! stack     at maybeClose (internal/child_process.js:10[88](https://gitlab.com/edstein-lms/lms-ts/-/jobs/3256796155#L88):16)
node-pre-gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:2[96](https://gitlab.com/edstein-lms/lms-ts/-/jobs/3256796155#L96):5)
node-pre-gyp ERR! System Linux 5.4.0-[121](https://gitlab.com/edstein-lms/lms-ts/-/jobs/3256796155#L121)-generic
node-pre-gyp ERR! command "/usr/local/bin/node" "/app/node_modules/canvas/node_modules/.bin/node-pre-gyp" "install" "--fallback-to-build" "--update-binary"
node-pre-gyp ERR! cwd /app/node_modules/canvas
node-pre-gyp ERR! node -v v14.19.3
node-pre-gyp ERR! node-pre-gyp -v v1.0.10
node-pre-gyp ERR! not ok 
Failed to execute '/usr/local/bin/node /usr/local/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js configure --fallback-to-build --update-binary --module=/app/node_modules/canvas/build/Release/canvas.node --module_name=canvas --module_path=/app/node_modules/canvas/build/Release --napi_version=8 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v83' (1)

Your Environment

package.json dependencies:

{
    "@editorjs/checklist": "^1.2.0",
    "@editorjs/code": "^2.6.0",
    "@editorjs/delimiter": "^1.2.0",
    "@editorjs/editorjs": "^2.19.0",
    "@editorjs/embed": "^2.4.0",
    "@editorjs/header": "^2.6.0",
    "@editorjs/image": "^2.6.0",
    "@editorjs/inline-code": "^1.3.1",
    "@editorjs/link": "^2.3.1",
    "@editorjs/list": "^1.6.0",
    "@editorjs/marker": "^1.2.2",
    "@editorjs/paragraph": "^2.8.0",
    "@editorjs/quote": "^2.4.0",
    "@editorjs/raw": "^2.2.0",
    "@editorjs/simple-image": "^1.4.0",
    "@editorjs/table": "^1.3.0",
    "@editorjs/warning": "^1.2.0",
    "@sentry/react": "^6.17.9",
    "@sentry/tracing": "^6.17.9",
    "@types/body-scroll-lock": "^2.6.1",
    "@types/codemirror": "^0.0.98",
    "@types/react-beautiful-dnd": "^13.0.0",
    "@types/react-color": "^3.0.4",
    "@types/react-helmet": "^5.0.15",
    "@types/react-textarea-autosize": "^4.3.5",
    "@types/react-transition-group": "^4.2.4",
    "@types/reactour": "^1.17.1",
    "@types/swiper": "^5.4.0",
    "@types/to-snake-case": "^1.0.0",
    "arr-union": "3.1.0",
    "axios": "0.19.0",
    "body-scroll-lock": "^3.0.3",
    "camelcase-keys": "^6.2.2",
    "chart.js": "3.8.2",
    "class-transformer": "0.2.3",
    "class-validator": "0.11.0",
    "classnames": "2.2.6",
    "clone-deep": "4.0.1",
    "codemirror": "5.52.2",
    "connected-react-router": "6.6.1",
    "core-js": "^3.22.7",
    "d3-selection": "^2.0.0",
    "d3-shape": "^2.0.0",
    "dotenv": "8.2.0",
    "editorjs-paragraph-with-alignment": "3.x",
    "file-saver": "2.0.2",
    "history": "4.10.1",
    "html-to-image": "^1.7.0",
    "kind-of": "6.0.3",
    "lodash.difference": "4.5.0",
    "lodash.isequal": "4.5.0",
    "mime-types": "2.1.26",
    "mixin-deep": "2.0.1",
    "moment": "2.24.0",
    "moment-duration-format": "^2.3.2",
    "normalize.css": "8.0.1",
    "nouislider-react": "^3.3.8",
    "prettysize": "^2.0.0",
    "pure-react-carousel": "1.25.2",
    "qs": "6.9.1",
    "rc-swipeout": "^2.0.11",
    "react": "16.14.0",
    "react-beautiful-dnd": "^13.0.0",
    "react-chartjs-2": "2.9.0",
    "react-codemirror2": "7.1.0",
    "react-color": "^2.19.3",
    "react-dates": "21.8.0",
    "react-device-detect": "1.12.1",
    "react-dom": "16.14.0",
    "react-editor-js": "^1.6.2",
    "react-helmet": "^6.0.0",
    "react-id-swiper": "^4.0.0",
    "react-minimal-datetime-range": "^1.6.0",
    "react-pdf": "4.1.0",
    "react-player": "^2.6.2",
    "react-redux": "7.1.3",
    "react-router-dom": "5.1.2",
    "react-sortable-hoc": "1.11.0",
    "react-text-mask": "^5.4.3",
    "react-textarea-autosize": "^7.1.2",
    "react-transition-group": "^4.4.1",
    "react-use": "^17.4.0",
    "react-webcam": "^5.2.1",
    "reactour": "^1.18.0",
    "redux": "4.0.5",
    "redux-thunk": "2.3.0",
    "reflect-metadata": "0.1.13",
    "reselect": "4.0.0",
    "snakecase-keys": "^3.2.0",
    "styled-components": "4.0.0",
    "swiper": "^5.4.5",
    "to-snake-case": "^1.0.0",
    "video-react": "0.14.1"
  },
  "devDependencies": {
    "@pmmmwh/react-refresh-webpack-plugin": "^0.5.7",
    "@svgr/webpack": "^5.5.0",
    "@swc/core": "^1.2.192",
    "@testing-library/react": "9.4.0",
    "@types/classnames": "2.2.9",
    "@types/enzyme": "3.10.4",
    "@types/file-saver": "2.0.1",
    "@types/lodash.difference": "4.5.6",
    "@types/lodash.isequal": "4.5.5",
    "@types/mime-types": "2.1.0",
    "@types/node-fetch": "2.5.4",
    "@types/qs": "6.9.0",
    "@types/react": "16.9.17",
    "@types/react-dates": "17.1.10",
    "@types/react-dom": "16.9.4",
    "@types/react-pdf": "4.0.3",
    "@types/react-redux": "7.1.5",
    "@types/react-router-dom": "5.1.3",
    "@types/react-test-renderer": "16.9.1",
    "@types/react-text-mask": "^5.4.7",
    "@types/redux-mock-store": "1.0.1",
    "@typescript-eslint/eslint-plugin": "5.22.0",
    "@typescript-eslint/parser": "5.22.0",
    "axios-mock-adapter": "1.17.0",
    "clean-webpack-plugin": "^4.0.0",
    "connect-history-api-fallback": "1.6.0",
    "cross-env": "7.0.0",
    "css-loader": "6.7.1",
    "directory-named-webpack-plugin": "4.0.1",
    "editorjs-text-color-plugin": "^1.1.22",
    "enzyme": "3.11.0",
    "enzyme-adapter-react-16": "1.15.2",
    "enzyme-to-json": "3.4.3",
    "esbuild-loader": "^2.18.0",
    "eslint": "8.14.0",
    "eslint-config-prettier": "8.5.0",
    "eslint-import-resolver-typescript": "^2.7.1",
    "eslint-plugin-import": "^2.26.0",
    "eslint-plugin-prettier": "4.0.0",
    "eslint-plugin-react": "7.29.4",
    "eslint-webpack-plugin": "^3.1.1",
    "file-loader": "^6.2.0",
    "fork-ts-checker-webpack-plugin": "7.2.11",
    "html-replace-webpack-plugin": "^2.6.0",
    "html-string-replace-webpack-plugin-webpack-4": "1.0.8",
    "html-webpack-plugin": "^5.3.1",
    "husky": "3.1.0",
    "lint-staged": "9.5.0",
    "merge-deep": "3.0.2",
    "mini-css-extract-plugin": "^2.6.0",
    "node-fetch": "2.6.0",
    "path-browserify": "^1.0.1",
    "postcss": "^8.4.12",
    "postcss-html": "^0.36.0",
    "postcss-loader": "^5.3.0",
    "postcss-scss": "^4.0.3",
    "prettier": "1.19.1",
    "progress-bar-webpack-plugin": "^2.1.0",
    "react-refresh": "^0.13.0",
    "react-test-renderer": "16.12.0",
    "redux-mock-store": "1.5.4",
    "sass": "^1.51.0",
    "sass-loader": "12.6.0",
    "sass-resources-loader": "2.2.5",
    "size-limit": "2.2.4",
    "speed-measure-webpack-plugin": "^1.5.0",
    "style-loader": "3.3.1",
    "stylelint": "^14.6.1",
    "stylelint-config-prettier": "9.0.3",
    "stylelint-config-recommended": "7.0.0",
    "stylelint-order": "5.0.0",
    "stylelint-scss": "4.2.0",
    "stylelint-webpack-plugin": "3.2.0",
    "swc-loader": "^0.2.1",
    "terser-webpack-plugin": "^5.3.0",
    "ts-node": "10.7.0",
    "typescript": "4.6.4",
    "url": "^0.11.0",
    "url-loader": "^4.1.1",
    "webpack": "^5.72.0",
    "webpack-bundle-analyzer": "^4.4.2",
    "webpack-cli": "4.9.2",
    "webpack-dev-server": "^4.9.0",
    "webpack-merge": "4.2.2",
    "workbox-webpack-plugin": "^6.1.5"
  },

Dockerfile

FROM node:14.19-alpine as deps
WORKDIR /app
COPY package.json ./
RUN npm i -g cross-env webpack-cli \
    && yarn install --cache-folder /tmp/yarn \
    && rm -rf /tmp/*

FROM deps as build
ARG PROJECT
ENV NODE_ENV=production \
    PROJECT=$PROJECT
COPY . .
RUN yarn build

FROM nginx:1.21.6-alpine
WORKDIR /app
COPY --from=build /app/dist/ /app/public/
COPY nginx.conf /etc/nginx/conf.d/default.conf
RUN ln -s ../data/system public/system \
    && ln -s ../data/scorms public/scorms \
    && mkdir data && chown nobody:nobody data
HEALTHCHECK --interval=30s --timeout=5s --start-period=5s CMD \
    curl -s 127.0.0.1/nginx_status | grep -q Active
kirill-martynov commented 1 year ago

Same error with node:18.12-alpine:


864.7 node-pre-gyp http GET https://github.com/Automattic/node-canvas/releases/download/v2.10.2/canvas-v2.10.2-node-v108-linux-musl-arm64.tar.gz
#12 864.7 node-pre-gyp ERR! install response status 404 Not Found on https://github.com/Automattic/node-canvas/releases/download/v2.10.2/canvas-v2.10.2-node-v108-linux-musl-arm64.tar.gz
#12 864.7 node-pre-gyp WARN Pre-built binaries not installable for canvas@2.10.2 and node@18.12.0 (node-v108 ABI, musl) (falling back to source compile with node-gyp)
#12 864.7 node-pre-gyp WARN Hit error response status 404 Not Found on https://github.com/Automattic/node-canvas/releases/download/v2.10.2/canvas-v2.10.2-node-v108-linux-musl-arm64.tar.gz
jeroenbourgois commented 1 year ago

I saw a Github Action failed, maybe it's related? https://github.com/Automattic/node-canvas/actions/runs/3353900475/jobs/5557061741#step:7:669

zbjornson commented 1 year ago

We don't have musl-libc prebuilds. More info in the troubleshooting guide:

Installation fails with a 404 in the log

If you're on Alpine Linux or another distro using musl-libc

The log may look like 

node-pre-gyp WARN Tried to download(404): https://github.com/node-gfx/node-canvas-prebuilt/releases/download/v2.6.0/canvas-v2.6.0-node-v64-linux-musl-x64.tar.gz

Prebuilds are only available for glibc, not musl-libc. See https://github.com/node-gfx/node-canvas-prebuilt/issues/77, which includes information on building from source.

GitHelge commented 1 year ago

Hmm same issue for me. My pipeline is failing now. Not sure why It worked before

kirill-martynov commented 1 year ago

So, we've added this:

apk add --no-cache build-base g++ cairo-dev jpeg-dev pango-dev giflib-dev
apk add --update --repository http://dl-3.alpinelinux.org/alpine/edge/testing libmount ttf-dejavu ttf-droid ttf-freefont ttf-liberation ttf-ubuntu-font-family fontconfig

before:

RUN npm i -g cross-env webpack-cli \
    && yarn install --cache-folder /tmp/yarn \
    && rm -rf /tmp/*

And it's worked!