Skip to content

Commit

Permalink
Merge remote-tracking branch 'origin/main' into router-base
Browse files Browse the repository at this point in the history
  • Loading branch information
@btkostner
btkostner committed Jun 30, 2021
2 parents d777b73 + 58dd744 commit 1dc311d
Show file tree
Hide file tree
Showing 15 changed files with 230 additions and 195 deletions.
14 changes: 14 additions & 0 deletions docs/pages/en/1.getting-started/2.providers.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,20 @@ The default provider for Nuxt Image is [ipx](/providers/ipx) or [static](/gettin

[Learn more about Nuxt deployment targets](https://nuxtjs.org/docs/2.x/features/deployment-targets)

### Local Images

Images should be stored in the `static/` directory of your project.

For example, when using `<nuxt-img src="/nuxt-icon.png" />`, it should be placed in `static/` folder under the path `static/nuxt-icon.png`.

Image stored in the `assets/` directory are **not** proccessed with Nuxt Image because those images are managed by webpack.

For more information, you can learn more about the [static directory here](https://nuxtjs.org/docs/2.x/directory-structure/static).

### Remote Images

Using default provider, you can also optimize external URLs. For this, you need to add them to [`domains`](/api/options#domains) option.

### Environment Detection

You can set default provider using `NUXT_IMAGE_PROVIDER` environment variable. Providers below, are automatically detected:
Expand Down
12 changes: 3 additions & 9 deletions docs/pages/en/2.components/1.nuxt-img.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,15 +25,9 @@ Will result in:
<img src="/nuxt-icon.png" />
```

### File Location

Images should be stored in the `static` directory.

For example, the `nuxt-icon.png` referred to in the previous example should be placed in `static` folder under the path `/static/nuxt-icon.png`.

In other words, image stored in the `assets` directory are not compatible with Nuxt Image because those images are managed by webpack.

For more information, you can learn more about the [static directory here](https://nuxtjs.org/docs/2.x/directory-structure/static).
:::alert{type="info"}
With [default provider](/getting-started/providers#default-provider), you should put `/nuxt-icon.png` inside `static/` directory for making above example working.
:::

## Props

Expand Down
14 changes: 9 additions & 5 deletions docs/pages/en/4.providers/ipx.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ navigation:
title: IPX
---

Nuxt Image comes with a preconfigured instance of [ipx](https://github.com/unjs/ipx). An open source, self-hosted image optimizer based on [sharp](https://github.com/lovell/sharp).
Nuxt Image comes with a [preconfigured instance](/getting-started/providers#default-provider) of [ipx](https://github.com/unjs/ipx). An open source, self-hosted image optimizer based on [sharp](https://github.com/lovell/sharp).

## Using `ipx` in production

Expand All @@ -15,14 +15,13 @@ Use IPX for self-hosting as an alternative to use service providers for producti
You don't need to follow this section if using `target: 'static'`.
:::


### Runtime Module

Just add `@nuxt/image` to `modules` (instead of `buildModules`) in `nuxt.config`. This will ensure that the `/_ipx` endpoint continues to work in production.

### Alternative: serverMiddleware
### Advanced: Custom ServerMiddleware

If you have an advanced use case, you may instead create a custom server middleware that handles the `/_ipx` endpoint:
If you have an usecase of a custom IPX instance serving other that `static/` dir, you may instead create a server Middleware that handles the `/_ipx` endpoint:

1. Add `ipx` as a dependency:

Expand All @@ -49,7 +48,12 @@ If you have an advanced use case, you may instead create a custom server middlew
import { createIPX, createIPXMiddleware } from 'ipx'

// https://github.com/unjs/ipx
const ipx = createIPX(/* options */)
const ipx = createIPX({
dir: '', // absolute path to images dir
domains: [], // allowed external domains (should match domains option in nuxt.config)
alias: {}, // base alias
sharp: {}, // sharp options
})

export default createIPXMiddleware(ipx)
```
Expand Down
4 changes: 2 additions & 2 deletions example/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,8 @@
"start": "nuxt start"
},
"devDependencies": {
"@nuxt/image": "^0.4.13",
"nuxt": "^2.15.6",
"@nuxt/image": "^0.4.17",
"nuxt": "^2.15.7",
"nuxt-vite": "^0.1.1"
}
}
158 changes: 80 additions & 78 deletions example/yarn.lock
View file
Original file line number Diff line number Diff line change
Expand Up @@ -953,10 +953,10 @@
mkdirp "^1.0.4"
rimraf "^3.0.2"

"@nuxt/babel-preset-app@2.15.6":
version "2.15.6"
resolved "https://registry.yarnpkg.com/@nuxt/babel-preset-app/-/babel-preset-app-2.15.6.tgz#cda22f236fcea30189982b75225747122e7b14a3"
integrity sha512-N5K5D3hSQhIrRBCvJDQHX3LaQIj98pmxg0Emoe6ZJG7NH4j2jcGjGeADLXh1KYl0JyOoyg46FpP/lxhQYcV3aQ==
"@nuxt/babel-preset-app@2.15.7":
version "2.15.7"
resolved "https://registry.yarnpkg.com/@nuxt/babel-preset-app/-/babel-preset-app-2.15.7.tgz#5f51b2f5f4aa604cc80d2a5698b97dd34e19d63b"
integrity sha512-iSdnacldHhIinWpzVpX4QfEFgNqn3VQAAB7y6iQ0JELUgfv7sPv3j3Klih+IStru4iCbUKOaSCdQ+A6mbQ0vNg==
dependencies:
"@babel/compat-data" "^7.14.0"
"@babel/core" "^7.14.0"
Expand All @@ -975,15 +975,15 @@
core-js-compat "^3.12.1"
regenerator-runtime "^0.13.7"

"@nuxt/builder@2.15.6":
version "2.15.6"
resolved "https://registry.yarnpkg.com/@nuxt/builder/-/builder-2.15.6.tgz#61f6a0727d3af4672838e62627ceaba07f18d6d0"
integrity sha512-m5kdq5vXaW2AB/nVwXKEcqqFMJ1ydl1sOW2MvxO8eyrmKzJyiQ7D4TZQnjmERzVPj3FhAhPKgVCP2FPpacoBFw==
"@nuxt/builder@2.15.7":
version "2.15.7"
resolved "https://registry.yarnpkg.com/@nuxt/builder/-/builder-2.15.7.tgz#4703c9d21756128f4ebfbf14e7b099bee7463626"
integrity sha512-vVZvcgvhL05Omp9AuqdDz2zfhBOmCXpVyt1IBUqR99QaorLICGg2iIHC42exj9yN3rBrpURQwb1OrIgt5o5KDQ==
dependencies:
"@nuxt/devalue" "^1.2.5"
"@nuxt/utils" "2.15.6"
"@nuxt/vue-app" "2.15.6"
"@nuxt/webpack" "2.15.6"
"@nuxt/utils" "2.15.7"
"@nuxt/vue-app" "2.15.7"
"@nuxt/webpack" "2.15.7"
chalk "^4.1.1"
chokidar "^3.5.1"
consola "^2.15.3"
Expand All @@ -996,13 +996,13 @@
serialize-javascript "^5.0.1"
upath "^2.0.1"

"@nuxt/cli@2.15.6":
version "2.15.6"
resolved "https://registry.yarnpkg.com/@nuxt/cli/-/cli-2.15.6.tgz#33f6c3add01477af60b8a93b73464c1f539d872b"
integrity sha512-vlFiF1444SqseMxhmOpm1sNgTdSuHth8YiMoxpIZr5RnKxjD523A04ozMFcEAkbQLELkKMlW3LttvDzulLC+hA==
"@nuxt/cli@2.15.7":
version "2.15.7"
resolved "https://registry.yarnpkg.com/@nuxt/cli/-/cli-2.15.7.tgz#21fb8a969bc5e222aa95289fcccc44f9ff7c5549"
integrity sha512-rbJqmHuN+ZftSpQNzgiaGP2L2pt45kCbWjCmLUF9pPYQ1pysl9GHVb+1LFf1Wn4wczJckH3Jc9Pl9r2KsLAteA==
dependencies:
"@nuxt/config" "2.15.6"
"@nuxt/utils" "2.15.6"
"@nuxt/config" "2.15.7"
"@nuxt/utils" "2.15.7"
boxen "^5.0.1"
chalk "^4.1.1"
compression "^1.7.4"
Expand Down Expand Up @@ -1040,12 +1040,12 @@
upath "^2.0.1"
vue-template-compiler "^2.6.12"

"@nuxt/config@2.15.6":
version "2.15.6"
resolved "https://registry.yarnpkg.com/@nuxt/config/-/config-2.15.6.tgz#8a476b08c0d55f441dcf704c7e8f59a9d731dfff"
integrity sha512-3HG7s3f5s5CfkoKNjCVBJA8v8mfej0EZ4pQ/NtH7Q11TAVOrpfQ7mlV1dy/syMMkQ6ykKIPOxRilpz1gc+fBjQ==
"@nuxt/config@2.15.7":
version "2.15.7"
resolved "https://registry.yarnpkg.com/@nuxt/config/-/config-2.15.7.tgz#960c6e85610f5aa63ab5e3bc6e3f611ad935df3b"
integrity sha512-XswQJOcxSR5CBLW5ZFtbyBAO2/yYrHjK5CE+5aaidzEgXjnmw3qnVOxxVHKWNpM42+35Ysu8RmZzRg4qw+Nxjw==
dependencies:
"@nuxt/utils" "2.15.6"
"@nuxt/utils" "2.15.7"
consola "^2.15.3"
defu "^4.0.1"
destr "^1.1.0"
Expand All @@ -1055,14 +1055,14 @@
std-env "^2.3.0"
ufo "^0.7.4"

"@nuxt/core@2.15.6":
version "2.15.6"
resolved "https://registry.yarnpkg.com/@nuxt/core/-/core-2.15.6.tgz#8532d3d389de3cef54c399fd48f1c9b76aa54376"
integrity sha512-f31dPCpMEHOQbWVOhcnXpC7pB4qo2PI3C9NkAkyFRhdMGw3+029T6oOHj+ZPWhR2f2hxwcIGonxOLFFmh/HBuw==
"@nuxt/core@2.15.7":
version "2.15.7"
resolved "https://registry.yarnpkg.com/@nuxt/core/-/core-2.15.7.tgz#fb0e56759da33a2bff322a5331cc44b3a4274bf0"
integrity sha512-+Drmkx+xp4WBpxRxAtMUpTUxystNV6nj6TuYInWvnhyFoCMJm0ES7ij8UfWOZo8FQjleBzVcucrTTh+AjRgmnQ==
dependencies:
"@nuxt/config" "2.15.6"
"@nuxt/server" "2.15.6"
"@nuxt/utils" "2.15.6"
"@nuxt/config" "2.15.7"
"@nuxt/server" "2.15.7"
"@nuxt/utils" "2.15.7"
consola "^2.15.3"
fs-extra "^9.1.0"
hable "^3.0.0"
Expand All @@ -1086,12 +1086,12 @@
error-stack-parser "^2.0.0"
string-width "^2.0.0"

"@nuxt/generator@2.15.6":
version "2.15.6"
resolved "https://registry.yarnpkg.com/@nuxt/generator/-/generator-2.15.6.tgz#309dbb1b70294c8939b5944364442b0998be9a6c"
integrity sha512-dIZEl0IuLOrpieLRIEAizjPE86EaptISyFuL4+wHr2aGsN/RK6x5EuaQPK3jV7FKUEluHAL3vnImkXRBT19ckA==
"@nuxt/generator@2.15.7":
version "2.15.7"
resolved "https://registry.yarnpkg.com/@nuxt/generator/-/generator-2.15.7.tgz#bac30a1cc277c12b6f61fa93bb4d9e731992e249"
integrity sha512-TlgWzVh7bTusaUCYqg6kZm62sr/TVWKU2V2ymhhLoiKaSP7dMK9PNVgnh9EXeIf5TD6zDzDOgo6j4eZOhO1dng==
dependencies:
"@nuxt/utils" "2.15.6"
"@nuxt/utils" "2.15.7"
chalk "^4.1.1"
consola "^2.15.3"
defu "^4.0.1"
Expand All @@ -1115,11 +1115,12 @@
node-fetch "^2.6.1"
web-streams-polyfill "^3.0.1"

"@nuxt/image@^0.4.13":
version "0.4.13"
resolved "https://registry.yarnpkg.com/@nuxt/image/-/image-0.4.13.tgz#41e5d2ff7b642e40fd867d6d62d94c8f07152d63"
integrity sha512-IKUlptS7AUpYLvd3r96BaFaZcjQcDJQBwuFZEzfZfk9F7Ckum/rLqc3l4RSLiX3Fhw1oDeUw2eqTftxmN8L1rA==
"@nuxt/image@^0.4.17":
version "0.4.17"
resolved "https://registry.yarnpkg.com/@nuxt/image/-/image-0.4.17.tgz#35eaf2de4c475839e9c7f12029510c2252998839"
integrity sha512-5eOGIpNHqugq0nKZzSM5BsYew9Akbx9RjIZdajxRU9J2CU//E43QY+fZh2BUCPQZkUYJWcDWo8qYexJyQzdMWg==
dependencies:
consola "^2.15.3"
defu "^5.0.0"
fs-extra "^10.0.0"
hasha "^5.2.2"
Expand All @@ -1131,6 +1132,7 @@
p-limit "^3.1.0"
rc9 "^1.2.0"
requrl "^3.0.2"
semver "^7.3.5"
ufo "^0.7.5"
upath "^2.0.1"

Expand All @@ -1154,13 +1156,13 @@
consola "^2.15.0"
node-fetch "^2.6.1"

"@nuxt/server@2.15.6":
version "2.15.6"
resolved "https://registry.yarnpkg.com/@nuxt/server/-/server-2.15.6.tgz#d514c2f8f6d640fb97e785a7927103e751ebed05"
integrity sha512-lyqyHCBX5oMW3paHtTKC0flQddm1VhL/+itM+wkiJ4c5dh9peIcizKIVKG1xE9dS+8q0MwI48DqtO35Ogef53w==
"@nuxt/server@2.15.7":
version "2.15.7"
resolved "https://registry.yarnpkg.com/@nuxt/server/-/server-2.15.7.tgz#cd93b92d7256eaaa40794fd7ed997bdd9929ce54"
integrity sha512-VyE7SCB/mpaJKnOuEZTJD9LESELPGXqEXnoWnqYWbgn8mmZYafT5Yto/26T+1TZkxXl8CH23Qa2VWVJR/OOATg==
dependencies:
"@nuxt/utils" "2.15.6"
"@nuxt/vue-renderer" "2.15.6"
"@nuxt/utils" "2.15.7"
"@nuxt/vue-renderer" "2.15.7"
"@nuxtjs/youch" "^4.2.3"
compression "^1.7.4"
connect "^3.7.0"
Expand Down Expand Up @@ -1201,10 +1203,10 @@
rc9 "^1.2.0"
std-env "^2.3.0"

"@nuxt/utils@2.15.6":
version "2.15.6"
resolved "https://registry.yarnpkg.com/@nuxt/utils/-/utils-2.15.6.tgz#ec827f640f9a1a3dc5faa0d23191378759913205"
integrity sha512-PExDIbNRAc317pUwEEIKxSSdYiRLkgGNLu9GxrcVrwo4BxuRI+UIBoJdKXMRiIIc+FkTQdj+MiOFGHs6TQjJug==
"@nuxt/utils@2.15.7":
version "2.15.7"
resolved "https://registry.yarnpkg.com/@nuxt/utils/-/utils-2.15.7.tgz#686c8e06c30c02b2af3b15f8bdd48e10a813766b"
integrity sha512-C8K3DAzJ8+PMRDBnYBxJpZunwmmMWRry8JvyZO7RyLWoHTK/GFndaF4mLIXWiXK2cpIJ3v2PInz+hJXZHkWKTQ==
dependencies:
consola "^2.15.3"
create-require "^1.1.1"
Expand All @@ -1219,10 +1221,10 @@
ua-parser-js "^0.7.28"
ufo "^0.7.4"

"@nuxt/vue-app@2.15.6":
version "2.15.6"
resolved "https://registry.yarnpkg.com/@nuxt/vue-app/-/vue-app-2.15.6.tgz#0be8b7bd9961eada3f1c7893229a310991f8dc0d"
integrity sha512-BI40rm5+LI/RdyKM/7+1fCZ8EAzbg8d1vXCwA/cPy04w1zwA6DEwBFkfYvmgTzbkHPPIPu7nN+0Uh0lfCiomBQ==
"@nuxt/vue-app@2.15.7":
version "2.15.7"
resolved "https://registry.yarnpkg.com/@nuxt/vue-app/-/vue-app-2.15.7.tgz#159908f1900e5bb7f6e1672dd9a407afb2d84396"
integrity sha512-TjJ3fkA6797/EzejFjkUbsDxwvI0SeoS5SiP19axLkSEJKHRv2ME4vIN7BbmMflCmot/wXHHUxH7gWPUFKKsUA==
dependencies:
node-fetch "^2.6.1"
ufo "^0.7.4"
Expand All @@ -1235,13 +1237,13 @@
vue-template-compiler "^2.6.12"
vuex "^3.6.2"

"@nuxt/vue-renderer@2.15.6":
version "2.15.6"
resolved "https://registry.yarnpkg.com/@nuxt/vue-renderer/-/vue-renderer-2.15.6.tgz#26329bf50bbd479b8fa3ea93ba7e927774ddec46"
integrity sha512-MPs0oS99mQ7yUoc91HcvX46XjquHocrpvKVjVUia/dJGk2UFfb1/PZW3G4a69wOQOx2Xh9uibe0/NjjegZ+40g==
"@nuxt/vue-renderer@2.15.7":
version "2.15.7"
resolved "https://registry.yarnpkg.com/@nuxt/vue-renderer/-/vue-renderer-2.15.7.tgz#9a18a366d7602eed20b437f658e086e40ae79914"
integrity sha512-B3NL5VE0Y17+v55AX/h4SfcB8njVnUlC0KvOQTxem6HB0b01K9Un4zgVce1+p4yMKOI19v/K6B2dAWuSw6wCYA==
dependencies:
"@nuxt/devalue" "^1.2.5"
"@nuxt/utils" "2.15.6"
"@nuxt/utils" "2.15.7"
consola "^2.15.3"
defu "^4.0.1"
fs-extra "^9.1.0"
Expand All @@ -1252,15 +1254,15 @@
vue-meta "^2.4.0"
vue-server-renderer "^2.6.12"

"@nuxt/webpack@2.15.6":
version "2.15.6"
resolved "https://registry.yarnpkg.com/@nuxt/webpack/-/webpack-2.15.6.tgz#694f236b47643deb704ddded8acc256524b68605"
integrity sha512-Ozy5jVeUzLITyL79520+Rf/s36X1cQezLFPzSMhUtiH4sT5oRvmb6TxP/2S1i7meKJhARkeBiVEzgX3M/K9TTw==
"@nuxt/webpack@2.15.7":
version "2.15.7"
resolved "https://registry.yarnpkg.com/@nuxt/webpack/-/webpack-2.15.7.tgz#79fe5e751e9cd90219160ecdd97a1ea801636092"
integrity sha512-cVWBDfFVsjfBX628wM6tubMzbX1AnNilJQb90XBb92Gbx9EKwKNqRQMONqerzW0CFtq4/mv8kUUUVg2fpUVzcw==
dependencies:
"@babel/core" "^7.14.0"
"@nuxt/babel-preset-app" "2.15.6"
"@nuxt/babel-preset-app" "2.15.7"
"@nuxt/friendly-errors-webpack-plugin" "^2.5.1"
"@nuxt/utils" "2.15.6"
"@nuxt/utils" "2.15.7"
babel-loader "^8.2.2"
cache-loader "^4.1.0"
caniuse-lite "^1.0.30001228"
Expand Down Expand Up @@ -5997,26 +5999,26 @@ nuxt-vite@^0.1.1:
vite "^2.3.4"
vite-plugin-vue2 "^1.5.1"

nuxt@^2.15.6:
version "2.15.6"
resolved "https://registry.yarnpkg.com/nuxt/-/nuxt-2.15.6.tgz#628ff86d57c1d4671802777635ce7fd2c24f9091"
integrity sha512-smhzRJPdqg+coUfZwMyuUGKULbIkdawrFcypya15ByKAceWIhLjkOls64dnH574wpZQxA8bugFjGn3ih26eSFg==
nuxt@^2.15.7:
version "2.15.7"
resolved "https://registry.yarnpkg.com/nuxt/-/nuxt-2.15.7.tgz#45332e3b00ba5c1cf04688d42373c8ed7ef4dca7"
integrity sha512-opxIwaiX4/MvPD5yHEHvtPSEkQKPxg4WPscstnvWC8zX2n74/3DzlNQQAbxtLngW7tze9wsWavxgSMtJXsA8Uw==
dependencies:
"@nuxt/babel-preset-app" "2.15.6"
"@nuxt/builder" "2.15.6"
"@nuxt/cli" "2.15.6"
"@nuxt/babel-preset-app" "2.15.7"
"@nuxt/builder" "2.15.7"
"@nuxt/cli" "2.15.7"
"@nuxt/components" "^2.1.8"
"@nuxt/config" "2.15.6"
"@nuxt/core" "2.15.6"
"@nuxt/generator" "2.15.6"
"@nuxt/config" "2.15.7"
"@nuxt/core" "2.15.7"
"@nuxt/generator" "2.15.7"
"@nuxt/loading-screen" "^2.0.3"
"@nuxt/opencollective" "^0.3.2"
"@nuxt/server" "2.15.6"
"@nuxt/server" "2.15.7"
"@nuxt/telemetry" "^1.3.3"
"@nuxt/utils" "2.15.6"
"@nuxt/vue-app" "2.15.6"
"@nuxt/vue-renderer" "2.15.6"
"@nuxt/webpack" "2.15.6"
"@nuxt/utils" "2.15.7"
"@nuxt/vue-app" "2.15.7"
"@nuxt/vue-renderer" "2.15.7"
"@nuxt/webpack" "2.15.7"

object-assign@^4.0.1, object-assign@^4.1.0, object-assign@^4.1.1:
version "4.1.1"
Expand Down
4 changes: 2 additions & 2 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@
"fs-extra": "^10.0.0",
"hasha": "^5.2.2",
"image-meta": "^0.0.1",
"ipx": "^0.6.1",
"ipx": "^0.6.2",
"is-https": "^4.0.0",
"lru-cache": "^6.0.0",
"node-fetch": "^2.6.1",
Expand Down Expand Up @@ -62,7 +62,7 @@
"jsdom": "latest",
"jsdom-global": "latest",
"mkdist": "latest",
"nuxt": "^2.15.6",
"nuxt": "^2.15.7",
"playwright": "latest",
"siroc": "latest",
"standard-version": "latest",
Expand Down
Loading

0 comments on commit 1dc311d

Please sign in to comment.