Last active
January 10, 2017 18:27
-
-
Save ericdfields/309dc72e80f5623c3336db0ae0374781 to your computer and use it in GitHub Desktop.
Loading Inline SVG into React
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* | |
Use CSS for styling via the awesome styled-components library | |
https://styled-components.com | |
*/ | |
import styled from 'styled-components' | |
const LoadingImage = require('loading-svg/loading-spin.svg') | |
const LoadingComponent = styled(LoadingImage)` | |
width: 40px; | |
fill: #999; | |
` | |
export default LoadingComponent |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// nope |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* | |
The goal is still 100% inline <svg> tags, and I'm using React, so this is the best loader | |
https://github.com/jhamlet/svg-react-loader | |
Using the beta as of this writing, per the note at the beginning of the readme. | |
*/ | |
{ | |
test: /\.svg/, | |
loaders: [ | |
'svg-react' | |
] | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment