styxlab / gatsby-theme-try-ghost

A Gatsby theme to build flaring fast blogs from headless Ghost CMS
MIT License
136 stars 56 forks source link

mozjpeg error whilst trying to add plugin for inline images #252

Closed MJ7777777 closed 3 years ago

MJ7777777 commented 3 years ago

Hi, I'm having difficulty following your tutorial specifically up until this point I had a few issues but I resolved them however at this point https://www.jamify.org/2020/07/15/running-a-professional-blog-for-free/#add-plugin-for-inline-images

System: Ubuntu 20.10 (arm64) (Raspberry Pi4) npm 6.14.10 node v12.20.1 yarn 1.22.10

Yarn Error Log

Arguments: 
  /usr/bin/node /usr/share/yarn/bin/yarn.js add gatsby-rehype-inline-images

PATH: 
  /usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/snap/bin

Yarn version: 
  1.22.5

Node version: 
  12.20.1

Platform: 
  linux arm64

Trace: 
  Error: ENOENT: no such file or directory, lstat '/home/$USER/jamify-starter/node_modules/mozjpeg/�@@�@8@@@@@@��@@@@�'

I tried to manually add the mozjpg yarn add mozjpg

same issue:

$USER@HOST$:~/jamify-starter$ yarn add mozjpeg
yarn add v1.22.10
[1/4] Resolving packages...
[2/4] Fetching packages...
info fsevents@2.1.3: The platform "linux" is incompatible with this module.
info "fsevents@2.1.3" is an optional dependency and failed compatibility check. Excluding it from installation.
info fsevents@1.2.13: The platform "linux" is incompatible with this module.
info "fsevents@1.2.13" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
warning " > gatsby@2.27.0" has incorrect peer dependency "react@^16.4.2".
warning " > gatsby@2.27.0" has incorrect peer dependency "react-dom@^16.4.2".
warning "gatsby > @reach/router@1.3.4" has incorrect peer dependency "react@15.x || 16.x || 16.4.0-alpha.0911da3".
warning "gatsby > @reach/router@1.3.4" has incorrect peer dependency "react-dom@15.x || 16.x || 16.4.0-alpha.0911da3".
warning "gatsby > gatsby-link@2.6.0" has incorrect peer dependency "react@^16.4.2".
warning "gatsby > gatsby-link@2.6.0" has incorrect peer dependency "react-dom@^16.4.2".
warning "gatsby > gatsby-react-router-scroll@3.2.0" has incorrect peer dependency "react@^16.4.2".
warning "gatsby > gatsby-react-router-scroll@3.2.0" has incorrect peer dependency "react-dom@^16.4.2".
warning "gatsby > @reach/router > create-react-context@0.3.0" has incorrect peer dependency "react@^0.14.0 || ^15.0.0 || ^16.0.0".
warning "gatsby > @typescript-eslint/eslint-plugin > tsutils@3.17.1" has unmet peer dependency "typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta".
warning "gatsby > eslint-plugin-graphql > graphql-config > @endemolshinegroup/cosmiconfig-typescript-loader > ts-node@9.0.0" has unmet peer dependency "typescript@>=2.7".
warning "gatsby-plugin-netlify > webpack-assets-manifest@3.1.1" has unmet peer dependency "webpack@>=4.4.0".
warning "gatsby-plugin-preact > @prefresh/webpack@1.1.0" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
warning "gatsby-theme-try-ghost > styled-components@5.2.1" has unmet peer dependency "react-is@>= 16.8.0".
warning "gatsby-theme-try-ghost > gatsby-plugin-postcss@3.7.0" has unmet peer dependency "postcss@^8.0.5".
warning "gatsby-theme-try-ghost > gatsby-plugin-postcss > postcss-loader@4.2.0" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
warning "gatsby-theme-try-ghost > gatsby-plugin-postcss > postcss-loader@4.2.0" has unmet peer dependency "postcss@^7.0.0 || ^8.0.1".
error An unexpected error occurred: "ENOENT: no such file or directory, lstat '/home/$USER/jamify-starter/node_modules/mozjpeg/\u0001�\u0017@@�\u000f\f@8\b@\u001eu0006\u0005@@@@@�\u0001�\u0001\b\u0003\u0004\u0002\u0002@\u0002@\u001c\u001c\u0001\u0001\u0005@@\u001c�'".
info If you think this is a bug, please open a bug report with the information provided in "/home/$USER/jamify-starter/yarn-error.log".
info Visit https://yarnpkg.com/en/docs/cli/add for documentation about this command.
$USER@$HOST:~/jamify-starter$ 

I'd appreciate any recommendations on how to resolve this. Thanks

MJ7777777 commented 3 years ago

I thought I would attempt to build and compile from source mozjpeg to see it it helps.

These are the steps I took:

sudo apt-get update

sudo apt-get install cmake autoconf automake libtool nasm make pkg-config git

git clone https://github.com/mozilla/mozjpeg.git

cd mozjpeg
mkdir build && cd build
sudo cmake -G"Unix Makefiles" ../

sudo make install

sudo ln -s /opt/mozjpeg/bin/jpegtran /usr/bin/mozjpeg

I then did

cd jamify-starter

yarn add gatsby-rehype-inline-images

same issue.

An unexpected error occurred: "ENOENT: no such file or directory, lstat '/home/$USER/jamify-starter/node_modules/mozjpeg/\u0001�\u0017@@�\u000f\f@8\b@\u001eu0006\u0005@@@@@�\u0001�\u0001\b\u0003\u0004\u0002\u0002@\u0002@\u001c\u001c\u0001\u0001\u0005@@\u001c�'".
styxlab commented 3 years ago

@MJ7777777: Welcome to this project. I am sorry if you have difficulties installing the package.

Unfortunately, I am not able to reproduce your issue and it may well have something to do with your architecture (arm64) (Raspberry Pi4), yarn or node version. mozpeg is not a direct dependency of this project - it is installed by the 'sharp' module which is part of the gatsby-rehype-inline-images.

Something looks really broken (the path shown is not part of mozpeg and looks wrongly encoded). My advice is that you try to install on another machine first (if you can). At any case, please start completely over and document every step that you do. You can paste those steps (and the resulting) outcome here for further reference.

MJ7777777 commented 3 years ago

Sure, this is my 11 year old son's project hence trying to setup his first website on a raspberry pi 4. He preffered your look and feel to the deafult gatsby-ghost repo. I will start over when I have more time. I have spent a long time on this already and have no more available time today. I have managed to move past the above by building mozjpeg from source and then adding a symlink to but it now fails on

error An unexpected error occurred: "ENOENT: no such file or directory, lstat '/home/alejandro7777777/jamify-starter/node_modules/pngquant-bin/\u0001�'

I suspect its the arm64 architecture also as I had no issues using your template on macOS a while ago.

styxlab commented 3 years ago

Maybe the yarn.lock needs to be built on arm. If you have not done so, you can try to re-create all modules with:

rm -rf node_modules
rm -rf yarn.lock
yarn

You can also try to use npm instead of yarn (after removing node_modules and yarn.lock) as it might be better supported on other platforms.

styxlab commented 3 years ago

Closing this due to inactivity. This can be re-opened at any time.