Latest in Builds and Pipelines
Home → Builds and Pipelines
How to resize all JPGs in a folder to PNGs with a maximum width using FFmpeg?
FFmpeg is not only for converting videos, you know? I'll go straight to the point, here's how I use it.
This one command will get all JPGs in a folder, convert to PNGs and downscale it if it's more than 512px width:
This one command will get all JPGs in a folder, convert to PNGs and downscale it if it's more than 512px width:
for i in *.jpg; do ffmpeg -y -i "$i" -vf "scale='min(512,iw)':-1" -sws_flags bilinear "${i%.*}.png"; done How to convert all SVGs in a folder to PNG with Docker image?
I recently stumbled across this simple problem and realized, that I actually don't want to install any app like Inkscape just to do that. Came across this nice and simple docker image https://hub.docker.com/r/burke/svg2png.
Here's how I used it. First, I tried to run it against a single file to see if that works at all:
Here's how I used it. First, I tried to run it against a single file to see if that works at all:
docker run --rm -v `pwd`:/svg burke/svg2png "Logo.svg" -w 256Next.js ChunkLoadError: Loading chunk failed after deploying.
Everything was working fine locally, but the whole console gets red with
Here are the steps that helped in my situation:
Your TypeScript project can't find
You probably use VS Code, am I right? Then, restart your IDE. Yes, simple as that...
ChunkLoadError after you deploy to production. Moreover, the frontend becomes blank white and you see Application error: a client-side exception has occurred (see the browser console for more information). The issue seems to be here for a while, and it looks like no-one knows which part exactly is responsible for the error (Next.js or Webpack or both), but the workaround is present.Here are the steps that helped in my situation:
Your TypeScript project can't find
expo/tsconfig.base, although you are sure it is there (besides, the project works just fine). Here's the fix.You probably use VS Code, am I right? Then, restart your IDE. Yes, simple as that...
Storybook not building due to string-width ES Module dependency error.
You upgraded or just installed the latest Storybook 7 and now you can't build the project. No matter which Node version, NPM, Yarn, whatever other modules you have.
Error [ERR_REQUIRE_ESM]: require() of ES Module /x/node_modules/string-width/index.js from /x/node_modules/cli-table3/src/utils.js not supported. Instead change the require of index.js in /x/node_modules/cli-table3/src/utils.js to a dynamic import() which is available in all CommonJS modules. at Object.<anonymous> (/x/node_modules/cli-table3/src/utils.js:1:21) at Object.<anonymous> (/x/node_modules/cli-table3/src/table.js:2:15) at Object.<anonymous> (/x/node_modules/cli-table3/index.js:1:18) at Object.<anonymous> (/x/node_modules/@storybook/core-server/dist/index.js:113:7858) at Object.<anonymous> (/x/node_modules/@storybook/cli/dist/generate.js:11:4494) at Object.<anonymous> (/x/node_modules/@storybook/cli/bin/index.js:9:1) at Object.<anonymous> (/x/node_modules/storybook/index.js:3:1) { code:...[!] RollupError: Node tried to load your configuration as an ES module even though it is likely CommonJS. To resolve this, change the extension of your configuration to ".cjs" or pass the "--bundleConfigAsCjs" flag.
Sounds familiar?
It took me a while to figure out that the actual error is written lower:
To fix that, you just need to replace CommonJS export to ES export, which means your
It took me a while to figure out that the actual error is written lower:
Original error: module is not defined in ES module scope.module in the rollup.config.mjs file. To fix that, you just need to replace CommonJS export to ES export, which means your
module.exports = { should become export...View summary of all Docker containers memory usage
You can get pretty much all resource usage information with
However, with some command line magic you can get the summary. You can put this in a
docker stats, but what you will lack there is the summary.However, with some command line magic you can get the summary. You can put this in a
.sh script, and make it executable with chmod +x docker-memory.sh:mem_amount_total_with_unit=$(docker system info \ | grep 'Total Memory: ' \ | tr -d 'Total Memory: ') unit=$(echo ${mem_amount_total_with_unit} \ | sed 's/[0-9\.]*//g') mem_amount_total=$(echo ${mem_amount_total_with_unit} \ | sed...Simple load balancer with Docker, Nginx and Node.js
It is a common knowledge that Node.js is a single-threaded single-core process. It sounds like an issue, but it gives you full freedom over how many processes you can run and how many cores want to utilize.
There are several ways you can scale Node over whole machine: run multiple processes, use Node to run subprocesses, or use virtualization software. We will focus on the latter, and see how we can also load-balance requests between all of them with a quiet primitive Nginx configuration.
...
There are several ways you can scale Node over whole machine: run multiple processes, use Node to run subprocesses, or use virtualization software. We will focus on the latter, and see how we can also load-balance requests between all of them with a quiet primitive Nginx configuration.
...
Cannot augment module 'console' with value exports because it resolves to a non-module entity.
This error message appears when typings are exposed globally, yet TypeScript tries to validate module typings and the names conflict.
I got this with a Figma widget module
I got this with a Figma widget module
@figma/plugin-typings, and the solution was quite simple - add this to your .tsconfig.json:{ "compilerOptions": { ... "skipLibCheck": true, ...Convert all JPGs and PNGs in a folder to WEBP and AVIF with Node.js and Sharp
One of the easiest ways to convert all JPG and PNG images in a folder to WEBP and AVIF is to use the Sharp library.
Let's get straight to the point. We will need to install
Let's get straight to the point. We will need to install
sharp and glob.npm install --save glob sharpBuilding a Preact application into a standalone script with Rollup
Rollup is a module bundler for JavaScript, made for speed and simplicity of setup. It also does tree-shaking (imports only the functionality you actually imported), supports JSX compilation and provides other neat functionality.
Step 1. (boring) Install NPM dependencies. Let's start with something that any JS project starts with - install every tiny package we will need during our development. This includes Rollup itself, the Livereload plugin for Rollup which will automatically reload the app on every...
Step 1. (boring) Install NPM dependencies. Let's start with something that any JS project starts with - install every tiny package we will need during our development. This includes Rollup itself, the Livereload plugin for Rollup which will automatically reload the app on every...
Building React/Preact into a standalone script with Browserify
Browserify is a bundler that magically normalizes all your
Let's start with the basics. Imagine you have your application written in React, or maybe even in jQuery, and now you want to make sure it's built into one single script, minified and compressed of course. This is where Browserify comes handy.
...
npm requirements into something a browser can understand. This means that your whole application can be minified into just 1 script that you can include in a regular HTML page.Let's start with the basics. Imagine you have your application written in React, or maybe even in jQuery, and now you want to make sure it's built into one single script, minified and compressed of course. This is where Browserify comes handy.
...