filepond-plugin-file-validate-type | 🚦 File Type Validation plugin for FilePond | File Upload library

Now that I'm using the file pond, I'd like to scale the photos to fill the target dimensions unless they're all various sizes, which is why I added the image resize function. Its image resize function works.  However the image resize function does not work when I use the grid layout to show the pictures side by side.

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 have an API endpoint which works on PUT Request to update User info such as user avatar. This API is built on Django. In my Frontend, I'm using NUXT to upload the file using FilePond, I did the following:

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: