https://github.com/beaglefoot/svg-element-loader
Load svg images as DOM Elements with webpack
https://github.com/beaglefoot/svg-element-loader
Last synced: about 1 month ago
JSON representation
Load svg images as DOM Elements with webpack
- Host: GitHub
- URL: https://github.com/beaglefoot/svg-element-loader
- Owner: Beaglefoot
- License: mit
- Created: 2019-08-25T14:35:30.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2022-12-09T23:58:41.000Z (over 2 years ago)
- Last Synced: 2024-04-26T13:46:47.485Z (about 1 year ago)
- Language: TypeScript
- Size: 936 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 16
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
[](https://www.npmjs.com/package/svg-element-loader)
# svg-element-loader
Load svg images as DOM Elements with webpack
## Installation
```sh
npm install --save-dev svg-element-loader
```
**webpack.config**
```js
module.export = {
module: {
rules: [
{
test: /\.svg$/i,
loader: 'svg-element-loader'
}
]
}
};
```
**tsconfig.json**
```json
{
"include": ["node_modules/svg-element-loader/*.d.ts"]
}
```
## Usage
In JavaScript
```js
import playIcon from 'assets/play-icon.svg';
document.body.appendChild(playIcon);
```
[Element](https://developer.mozilla.org/en-US/docs/Web/API/Element) properties and methods are available. For example:
```js
playIcon.classList.add('emphasize');
const circle = playIcon.querySelector('circle[stroke="#fff"]');
circle.style.stroke = '#333';'
```
## License
[MIT](./LICENSE)