filepond-plugin-image-exif-orientation | Extract EXIF orientation information | Computer Vision library

As long as the line with useLazyQuery in App.js (code below) is removed, it will display simple "HELLO" message (working well), otherwise, I got the below error message

I currently have a signup form. Users have an optional field where they can upload a profile picture if they want.

If they don't upload a profile picture, I want to use a default profile picture for them (imagine the default facebook profile picture image for example).

My image imported as:

I'm trying to set up FilePond with its ImagePreview Plugin but even though filepond clearly loads the files something is messed up which results in a preview list that consists of only grey squares. Not even the image names are visible, even though the image-data is loaded correctly (e.g. the correct file name is put in the filepond--file-info-main span.) and the controls are clickable but also invisible.

I assume some css is interfering but I already tried removing both bootstrap and my custom styling from my project and it didn't change anything. The behaviour is the same for Filepond no matter whether there are any plugins enabled or not (with the image preview plugin the grey item just becomes taller, I assume it's a fixed height).

The css is imported from filepond in a vendor.js file

I'm trying to get my build much smaller to get my load time faster, but when I run

ng build --prod --aot --vendor-chunk --common-chunk --build-optimizer and then run a lighthouse report from google dev tools

I get

what's odd is that it seems to have worked if I go into the dist folder to look at file sizes, which seem smaller that the lighthouse report.

So far to reduce the size by doing the following:

• Removed old/unused package.json entries
• changed all material imports to specific path like for paginator I'm importing now as import { MatPaginator } from "@angular/material/paginator"; instead of import { MatPaginator } from "@angular/material/"; per the advice from other posts.
• replaced moment with moment.min.js so that locales don't get added
• added brotli for text compression.

Also I want to mention because I don't know if it's relevant, but I don't have a webpack.config.js file only a custom-webpack.config.js for brotli. The only thing I edited in angular.json to get webpack working was this for brotli

I'm following this tutorial and I'm trying to get brotli working with angular projectI created a ```custom-webpack.config.js file and put in the root directory where angular.json is located. (also tried src folder, but that didn't work) As soon as I update the angular.json file to

I'm having some trouble using Filepond for React. Currently, I want to preload a user's profile picture when the page is loaded. I have tried two different approaches but none have worked yet:

First, I try to use the server load option of Filepond like so: