Skip to content

Releases: boopathi/react-svg-loader

v3.0.1

06 May 08:29
Compare
Choose a tag to compare
  • Fix package.json version updates (27bce4a)

v3.0.0

05 May 13:48
Compare
Choose a tag to compare
  • Drop Node 6. Run tests on Node 8, 10, and 12
  • Upgrade dependencies

Fixes:

  • Close svgo object instead of mutating it (#250)
  • Compatibility between babel 6 and 7 for t.restElement and t.restProperty (#244)
  • Update to use fully resolved paths for babel plugins (#209)

v2.1.0

12 Oct 23:12
Compare
Choose a tag to compare

Rollup plugin

Two new packages -

v2.0.0

11 Oct 15:56
Compare
Choose a tag to compare

Drops Node 0.12 support & webpack 1 support

Tests are run on Node 4, 6, and 8

Output change from component class to arrow function

Previously, the output of the react-svg-loader was -

import React from "react";
export default class SVG extends React.Component {
  render() {
    return <svg {...this.props}>{svgContent}</svg>;
  }
}

and now it is -

import React from "react";
export default props => <svg {...props}>{svgContent}</svg>;

Overridable classnames (to use with css-modules)

Previously, class values are NOT transformed. Now they are transformed such that the output component can be used with css-modules

<svg class="foo bar">

is transformed to

<svg className={ (styles["foo"] || "foo") + " " + (styles["bar"] || "bar") }>

So, you can pass/override some styles in the svg, for example -

import Image from "react-svg-loader!./image.svg";
import styles from "./styles.css"; // with css-modules

const imageStyles = {
  foo: styles.foo,
  bar: styles.bar
}

let component = <Image styles={imageStyles} />

Drop option es5

Previously, you could do,

{
  loader: "react-svg-loader",
  options: {
    es5: true
  }
}

and get output transpiled to ES5 using babel-preset-es2015.

This is now deprecated and the recommended way to use react-svg-loader is to use it with babel-loader

{
  test: /\.svg$/,
  use: [
    "babel-loader",
    "react-svg-loader"
  ]
}

and with babel-preset-env in .babelrc:

{
  "presets": [
    [
      "env",
      {
        "target": {
          "browsers": "IE > 11"
        }
      }
    ]
  ]
}

Move to 3 packages

Now react-svg-loader is split into 3 packages

v2.0.0-alpha.4

11 Oct 13:54
Compare
Choose a tag to compare
v2.0.0-alpha.4 Pre-release
Pre-release

v2.0.0-alpha.1

02 Feb 21:56
Compare
Choose a tag to compare
v2.0.0-alpha.1 Pre-release
Pre-release
  • Drop Node 5 from travis. Now supports Node 4, 6, 7.
  • Fix data-* props from converting to camelCase
  • Change deps from ^ to ~
  • Yarnify!

v2.0.0-alpha-0

08 Oct 15:47
Compare
Choose a tag to compare
v2.0.0-alpha-0 Pre-release
Pre-release
  • Drop Node 0.12 support and Node 6 support
  • Default output is ES2015 instead of JSX - use --jsx to get jsx output
  • Drop --es5 CLI and loader flag support in favour of using babel-loader
  • Drop -0 support as yargs seems to not support numbers?
  • Update deps

v1.1.0

01 Aug 16:26
Compare
Choose a tag to compare
  • Update packages
  • Change handling of props - a162ecf
  • Merge to single visitor - 25a166c

v1.0.1

17 Apr 20:42
Compare
Choose a tag to compare
  • Fix bugs with SVGO options in CLI
  • Fix class -> className conversion

v1.0.0

10 Apr 21:03
Compare
Choose a tag to compare

The new rewrite. Check README for more.

Rewrite 😃

Input SVG

SVG Optimize using SVGO

Babel Transform with `preset=react` and plugin=svgToComponent