11ty-dither 中文文档教程

发布于 3年前 浏览 21 项目主页 更新于 3年前

尚未准备好生产

@11ty-dither

使用 dither-me-this 在构建时抖动图像 11ty。

11ty-dither 获取源图像,并输出多种尺寸和格式的抖动图像。 它将您的 元素替换为响应式 元素。

@11ty-dither 和 dither-me-this 是开源项目。 你可以通过 github 贡献。

Setup

npm install @11ty-dither
const { ditherAllImages } = require('@11ty-dither')

module.exports = (eleventyConfig) => {

    const ditherOptions = {

        /* Options for dither-me-this work here */

        inputDirectory: './src',
        outputDirectory: './_site',
        imageFolder: '/images',
        palette: ["#000", "#FFF"]
    }

    eleventyConfig.addPlugin(ditherAllImages, ditherOptions)

}

Not Ready for Production

@11ty-dither

Dither images at build time for 11ty using dither-me-this.

11ty-dither takes a source image, and outputs dithered images in multiple sizes and formats. It replaces your <img> element with a responsive <picture> element.

@11ty-dither and dither-me-this are open source projects. You can contribute via github.

Setup

npm install @11ty-dither
const { ditherAllImages } = require('@11ty-dither')

module.exports = (eleventyConfig) => {

    const ditherOptions = {

        /* Options for dither-me-this work here */

        inputDirectory: './src',
        outputDirectory: './_site',
        imageFolder: '/images',
        palette: ["#000", "#FFF"]
    }

    eleventyConfig.addPlugin(ditherAllImages, ditherOptions)

}
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文