diff --git a/docs/advanced/build-flags.md b/docs/advanced/build-flags.md
index 41bf100..4c198e2 100644
--- a/docs/advanced/build-flags.md
+++ b/docs/advanced/build-flags.md
@@ -8,14 +8,6 @@ Most bundlers provide a `define` option to set build flags:
- [@rollup/plugin-replace](https://www.npmjs.com/package/@rollup/plugin-replace)
- [esbuild](https://esbuild.github.io/api/#define)
-## Disable Hash Decoding
-
-unlazy ships with the [BlurHash](/placeholders/blurhash) and [ThumbHash](/placeholders/thumbhash) decoding algorithms to decode the hash values into images.
-
-In case your project doesn't use these placeholders, you can disable the hash decoding algorithms to reduce the bundle size. Use the following build flags to tree-shake the hash decoding algorithms:
-
-- `__ENABLE_HASH_DECODING__`: This flag is set to `true` by default.
-
As an example, you can tree-shake the hash decoding algorithms in Vite by setting the `define` option in your `vite.config.ts` file:
```ts
@@ -24,13 +16,36 @@ import { defineConfig } from 'vite'
export default defineConfig({
define: {
- __ENABLE_HASH_DECODING__: false,
+ // Defaults to `true`
+ __UNLAZY_HASH_DECODING__: false,
+ // Defaults to `true`
+ __UNLAZY_LOGGING__: false,
},
})
```
+## Disable Hash Decoding
+
+unlazy ships with the [BlurHash](/placeholders/blurhash) and [ThumbHash](/placeholders/thumbhash) decoding algorithms to decode the hash values into images.
+
+In case your project doesn't use these placeholders, you can disable the hash decoding algorithms to reduce the bundle size. Use the following build flags to tree-shake the hash decoding algorithms:
+
+- `__UNLAZY_HASH_DECODING__`: This flag is set to `true` by default.
+
::: warning
This will only tree-shake the BlurHash and ThumbHash decoding algorithms when using the [`lazyLoad`](/api/lazy-load) method.
If you use either `unlazy/blurhash` or `unlazy/thumbhash` sub-path imports directly, the decoding algorithms will still be bundled.
:::
+
+## Disable Client Logging
+
+unlazy will help you locate missing `data-src` or `data-srcset` attributes in your project by logging a warning in the browser console. An example warning message looks like this:
+
+```bash
+[unlazy] Missing `data-src` or `data-srcset` attribute:
+```
+
+If you want to disable these warnings, you can use the following build flag:
+
+- `__UNLAZY_LOGGING__`: This flag is set to `true` by default.
diff --git a/packages/core/src/lazyLoad.ts b/packages/core/src/lazyLoad.ts
index 0d721c7..c5ada38 100644
--- a/packages/core/src/lazyLoad.ts
+++ b/packages/core/src/lazyLoad.ts
@@ -29,8 +29,8 @@ export function lazyLoad(
// Generate the blurry placeholder from a Blurhash or ThumbHash string if applicable
if (
- // @ts-expect-error: Compile-time flag to exclude this code from the bundle
- (typeof __ENABLE_HASH_DECODING__ === 'undefined' || __ENABLE_HASH_DECODING__)
+ // @ts-expect-error: Compile-time flag
+ (typeof __UNLAZY_HASH_DECODING__ === 'undefined' || __UNLAZY_HASH_DECODING__)
&& hash
) {
const placeholder = createPlaceholderFromHash({
@@ -45,7 +45,9 @@ export function lazyLoad(
// Bail if the image doesn't provide a `data-src` or `data-srcset` attribute
if (!image.dataset.src && !image.dataset.srcset) {
- console.error('[unlazy] Missing `data-src` or `data-srcset` attribute', image)
+ // @ts-expect-error: Compile-time flag
+ if (typeof __UNLAZY_LOGGING__ === 'undefined' || __UNLAZY_LOGGING__)
+ console.error('[unlazy] Missing `data-src` or `data-srcset` attribute', image)
continue
}
@@ -166,7 +168,9 @@ export function createPlaceholderFromHash(
}
}
catch (error) {
- console.error(`Error generating ${hashType} placeholder:`, error)
+ // @ts-expect-error: Compile-time flag
+ if (typeof __UNLAZY_LOGGING__ === 'undefined' || __UNLAZY_LOGGING__)
+ console.error(`Error generating ${hashType} placeholder:`, error)
}
}