Skip to content

Webpack loader for Coloor (image preloading utility)

License

Notifications You must be signed in to change notification settings

krasimir/coloor-loader

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

6 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

coloor-loader

Webpack loader for Coloor image preloading utility.

Usage

Install the loader with npm i coloor-loader -D and then add it to your webpack.config.js file:

var webpack = require('webpack');

module.exports = {
  entry: './src/component.jsx',
  devtool: 'source-map',
  output: {
    path: __dirname + '/dist',
    filename: 'bundle.js'
  },
  module: {
    loaders: [
      {
        test: /(\.jsx|\.js)$/,
        loader: 'babel',
        exclude: /(node_modules|bower_components)/,
        query: {
          presets: ['react', 'es2015']
        }
      },
      {
        test: /(\.jsx|\.js)$/,
        loader: 'coloor',
        exclude: /node_modules/,
        query: {
          images: [__dirname + '/photos'] // location of the images
        }
      }
    ]
  }
};

Coloor is a HTML preprocessor so it makes only sense when we work with HTML and the output is HTML too. Webpack (in general) is dealing with JavaScript. So, having this in mind we can say that coloor-loader is useful if we work with React and want to decorate transform JSX. To do that we have to parse the *.jsx* files before they reach Babel. This could e achieved by placing coloor-loaderat the end of theloaders` array.

About

Webpack loader for Coloor (image preloading utility)

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published