https://github.com/zcfan/image-ascii-loader

A webpack loader that load image as ascii text.
https://github.com/zcfan/image-ascii-loader

Last synced: about 1 month ago
JSON representation

A webpack loader that load image as ascii text.

• Host: GitHub
• URL: https://github.com/zcfan/image-ascii-loader
• Owner: zcfan
• License: mit
• Created: 2020-01-15T07:33:49.000Z (almost 6 years ago)
• Default Branch: master
• Last Pushed: 2023-01-07T13:45:13.000Z (almost 3 years ago)
• Last Synced: 2025-08-09T08:32:53.832Z (3 months ago)
• Language: JavaScript
• Size: 863 KB
• Stars: 1
• Watchers: 0
• Forks: 0
• Open Issues: 28
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# image-ascii-loader

A webpack loader that load image as ascii text.

## Demo

Generate this

![demo](https://github.com/zcfan/image-ascii-loader/raw/master/doc/demo.png)

from

![demo](https://github.com/zcfan/image-ascii-loader/raw/master/demo/demo.jpg)

feel free to clone and play with demo project.

## Guide

```bash

npm i -D image-ascii-loader

```

then edit your `webpack.config.js` .

```javascript

module.exports = {

  // ...

  module: {

    rules: [

      {

        test: /\.jpe?g$/,

        use: ["image-ascii-loader"]

      }

    ]

  },

};

```

With this config, all your jpeg file will be tranform to string, usually this is not what you want. You can skip configuration and do this instead:

```javascript

const ascii = require('image-ascii-loader!./demo.jpg');

document.getElementById('demo').innerHTML = ascii;

```

You can specify options use resourceQuery:

```javascript

// 100 characters per line 

const ascii = require('./demo.jpg?width=100');

// use other characters to draw the image

const ascii = require('./demo.jpg?alphabet=blocks');

```

check [ascii-art-image](https://www.npmjs.com/package/ascii-art-image) for more options.

## More

![I like this one](https://github.com/zcfan/image-ascii-loader/raw/master/doc/demo1.png)

Image source: readme of https://github.com/khrome/ascii-art project