Comments (5)
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.
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.
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.
+1 Because this would allow to import a complete folder with require.context.
from babel-plugin-inline-react-svg.
seems to have been fixed by #28
from babel-plugin-inline-react-svg.
Related Issues (20)
- SVGO plugins specified as objects seems not recognised (v2.0.1) HOT 2
- Specifying SVGO option breaks JSX transform HOT 11
- How do I add type declarations for the svg file imported? HOT 2
- Build error after upgrading from 1.1.2 to 2.0.1 HOT 7
- Adding aria-hidden attribute fails HOT 4
- viewBox stripped from HTML output (nextjs) HOT 7
- Warning: Invalid attribute name: `'data-name'` HOT 3
- Svg file path is not passed to svgo
- viewbox is not passed from svg to html in the babel-plugins-inline-react-svg version": "^2.0.1". HOT 3
- Warning: React does not recognize the `maskType` prop on a DOM element. HOT 3
- TypeError: Cannot read properties of undefined (reading 'uid') HOT 3
- tsconfig relative path does not work HOT 1
- Update svgo to v3.x.x HOT 9
- Font Awesome 6 SVG comments cause errors with plugin HOT 6
- Code injection vulnerability due to svgo HOT 1
- 'undefined is not a function' when using the new JSX transform HOT 14
- App crashing with "Cannot read property 'name' of undefined" after installing plugin HOT 2
- Error: <path> attribute d: Expected arc flag ('0' or '1'), "M21 0H3a3 3 0 0-3 3 NaNvNaNa3 3…" HOT 6
- Allow Typescript absolute path alias HOT 5
- Current version of svg dependency has vulnerabilities HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
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.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from babel-plugin-inline-react-svg.