Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 8 additions & 0 deletions packages/imgproxy/.size-limit.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
[
{
"name": "All publics",
"path": "dist/index.js",
"import": "*",
"limit": "1.5 kB"
}
]
86 changes: 86 additions & 0 deletions packages/imgproxy/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,86 @@
# @srcset/imgproxy

[![ESM-only package][package]][package-url]
[![NPM version][npm]][npm-url]
[![Node version][node]][node-url]
[![Dependencies status][deps]][deps-url]
[![Install size][size]][size-url]
[![Build status][build]][build-url]
[![Coverage status][coverage]][coverage-url]

[package]: https://img.shields.io/badge/package-ESM--only-ffe536.svg
[package-url]: https://nodejs.org/api/esm.html

[npm]: https://img.shields.io/npm/v/%40srcset%2Fimgproxy.svg
[npm-url]: https://npmjs.com/package/@srcset/imgproxy

[node]: https://img.shields.io/node/v/%40srcset%2Fimgproxy.svg
[node-url]: https://nodejs.org

[deps]: https://img.shields.io/librariesio/release/npm/%40srcset%2Fimgproxy
[deps-url]: https://libraries.io/npm/%40srcset%2Fimgproxy

[size]: https://deno.bundlejs.com/badge?q=%40srcset%2Fimgproxy
[size-url]: https://bundlejs.com/?q=%40srcset%2Fimgproxy

[build]: https://img.shields.io/github/actions/workflow/status/TrigenSoftware/srcset/tests.yml?branch=main
[build-url]: https://github.com/TrigenSoftware/srcset/actions

[coverage]: https://img.shields.io/codecov/c/github/TrigenSoftware/srcset.svg
[coverage-url]: https://app.codecov.io/gh/TrigenSoftware/srcset

Adapter for [imgproxy](https://imgproxy.net/): srcset variant urls for content images, e.g. from an API or a CMS.

- 馃寪 Runtime builder of loader-shaped srcset objects, isomorphic: browser and server
- 馃敀 Presets support via the `processing` hook - no transformations exposed to the browser
- 鉁嶏笍 Url signing on the server side
- 馃洜 Passthrough mode for local development without a running imgproxy instance

## Install

```bash
# pnpm
pnpm add @srcset/imgproxy @srcset/runtime
# yarn
yarn add @srcset/imgproxy @srcset/runtime
# npm
npm i @srcset/imgproxy @srcset/runtime
```

## Usage

Srcset objects for CMS images:

```ts
import { Imgproxy } from '@srcset/imgproxy'

const imgproxy = new Imgproxy({ endpoint: 'https://imgproxy.example.com' })
const { src, srcSet, srcMap } = imgproxy.image(photo.url, {
width: [600, 1200],
format: ['webp', 'jpg']
})
```

Signed urls, on the server side:

```ts
import { sign } from '@srcset/imgproxy/sign'

const imgproxy = new Imgproxy({
endpoint: 'https://imgproxy.example.com',
signer: sign({ key, salt })
})
```

Passthrough mode - untouched source urls, e.g. for local development without a running imgproxy instance:

```ts
const imgproxy = new Imgproxy({
endpoint: 'https://imgproxy.example.com',
passthrough: import.meta.env.DEV
})
```

## Documentation

For more details, guides and API references, check out the [documentation website](https://srcset.js.org/proxies/imgproxy/).
16 changes: 16 additions & 0 deletions packages/imgproxy/oxlint.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
import { defineConfig } from '@trigen/oxlint'
import testConfig from '@trigen/oxlint-config/test'
import tsTypeCheckedConfig from '@trigen/oxlint-config/typescript-type-checked'
import rootConfig from '../../oxlint.config.ts'

export default defineConfig({
extends: [
rootConfig,
tsTypeCheckedConfig,
testConfig
],
env: {
node: false,
browser: true
}
})
82 changes: 82 additions & 0 deletions packages/imgproxy/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,82 @@
{
"name": "@srcset/imgproxy",
"type": "module",
"version": "1.0.0",
"description": "Adapter for imgproxy: srcset variant urls for content images and static assets.",
"author": {
"name": "Dan Onoshko",
"email": "danon0404@gmail.com",
"url": "https://github.com/dangreen"
},
"license": "MIT",
"homepage": "https://srcset.js.org/proxies/imgproxy/",
"funding": "https://ko-fi.com/dangreen",
"repository": {
"type": "git",
"url": "https://github.com/TrigenSoftware/srcset.git",
"directory": "packages/imgproxy"
},
"bugs": {
"url": "https://github.com/TrigenSoftware/srcset/issues"
},
"keywords": [
"srcset",
"image",
"responsive",
"imgproxy"
],
"engines": {
"node": ">=22"
},
"sideEffects": false,
"exports": {
"./package.json": "./package.json",
".": "./src/index.ts",
"./sign": "./src/sign.ts"
},
"publishConfig": {
"exports": {
"./package.json": "./package.json",
".": {
"types": "./dist/index.d.ts",
"default": "./dist/index.js"
},
"./sign": {
"types": "./dist/sign.d.ts",
"default": "./dist/sign.js"
}
},
"directory": "package",
"linkDirectory": false
},
"files": [
"dist"
],
"scripts": {
"clear:package": "del ./package",
"clear:dist": "del ./dist",
"clear": "del ./package ./dist ./coverage",
"prepublishOnly": "run build clear:package clean-publish",
"postpublish": "pnpm clear:package",
"emitDeclarations": "tsc -p ./tsconfig.build.json --emitDeclarationOnly",
"build:dist": "run -p emitDeclarations [ vite build ]",
"build": "run clear:dist build:dist",
"lint": "oxlint",
"format": "oxlint --fix",
"test:unit": "vitest run --coverage",
"test:unit:watch": "vitest watch",
"test:size": "size-limit",
"test:types": "tsc --noEmit",
"test": "run -p lint test:unit test:types"
},
"peerDependencies": {
"@srcset/runtime": "workspace:^"
},
"devDependencies": {
"@size-limit/preset-small-lib": "^12.0.0",
"@srcset/runtime": "workspace:^",
"@types/node": "^22.0.0",
"sharp": "^0.35.3",
"size-limit": "^12.0.0"
}
}
Loading