Coder Social home page Coder Social logo

Comments (5)

 avatar commented on May 18, 2024 1

I've made it (miraculously) work for myself here.

I'm also using Webpack/TypeScript (those guys where the ones changing the import syntax to require in the first place), and they compile the code expecting an ES6 module structure. To match that, I changed how the SVG function is returned, so that it's within an object's default property, as you can see below.

var default_avatar_svg_1 = function () {
    function default_avatar_svg_1(props) {
        return React.createElement("svg", (0, _extends3.default)({
            version: "1",
            xmlns: "http://www.w3.org/2000/svg",
            width: "21.333",
            height: "21.333",
            viewBox: "0 0 16.000000 16.000000"
        }, props), React.createElement("path", {
            d: "…"
        }));
    }

    return {
        default: default_avatar_svg_1
    };
}();

Thus, I haven't created a PR here.

Although it works, I'm not particularly proud of the whole thing. It's also the first time I fiddle within these three technologies, so I'm sure I might have done something stupid there. If any of you knows anything that could help me there, please do let me know!

from babel-plugin-inline-react-svg.

prasannavl avatar prasannavl commented on May 18, 2024

I'm getting the same. Only import syntax seems to work. Any direct way to parse require as well?

from babel-plugin-inline-react-svg.

kesne avatar kesne commented on May 18, 2024

The plugin looks specifically for imports: https://github.com/kesne/babel-plugin-inline-react-svg/blob/master/src/index.js#L19

I use ES Module Syntax in all of my projects, so I haven't bothered to add support for require. I would happily accept a PR that did though!

from babel-plugin-inline-react-svg.

yn5 avatar yn5 commented on May 18, 2024

+1 Because this would allow to import a complete folder with require.context.

from babel-plugin-inline-react-svg.

fernandopasik avatar fernandopasik commented on May 18, 2024

seems to have been fixed by #28

from babel-plugin-inline-react-svg.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.