Image Loader

Tt's an image loader for symphony-joy, we can require a image in jsx.

Installation

npm install --save @symph/joy-image

or

yarn add @symph/joy-image

Usage

<img src={require("./logo.jpg")}/>

Configuring

Create a joy.config.js in your project

// joy.config.js
const withImageLoader = require('@symph/joy-image')

module.exports = {
  plugins: [
    withImageLoader({limit: 8192})
  ]
}

Options

urlLoaderOptions

type: object, default:

{
  limit: 8192,
  publicPath: `${assetPrefix}/_symphony/static/images/`,
  outputPath: `${isServer ? "../" : ""}static/images/`,
  name: "[name]-[hash].[ext]"
}

For details, please see

• url-loader
• file-loader

ruleOptions

type: object, default:

{
  test: /\.(jpe?g|png|svg|gif)$/
}

We can used this to custom a rule in webpackConfig.module.rules, such as the properties test, include, exclude and resource etc.