add svg as component for default template

Author: Xin Nie

template/default/package.json

@@ -27,6 +27,7 @@
     "react-dom": "^15.0.0 || ^16.0.0"
   },
   "devDependencies": {
+    "@svgr/rollup": "^2.4.1",
     "babel-core": "^6.26.3",
     "babel-eslint": "^8.2.5",
     "babel-plugin-external-helpers": "^6.22.0",

template/default/rollup.config.js

@@ -4,6 +4,7 @@ import external from 'rollup-plugin-peer-deps-external'
 import postcss from 'rollup-plugin-postcss'
 import resolve from 'rollup-plugin-node-resolve'
 import url from 'rollup-plugin-url'
+import svgr from '@svgr/rollup'
 
 import pkg from './package.json'
 
@@ -27,6 +28,7 @@ export default {
       modules: true
     }),
     url(),
+    svgr(),
     babel({
       exclude: 'node_modules/**',
       plugins: [ 'external-helpers' ]

template/default/src/index.js

@@ -1,6 +1,8 @@
 import React, { Component } from 'react'
 import PropTypes from 'prop-types'
 
+import { ReactComponent as ReactIcon } from './react-icon.svg'
+
 import styles from './styles.css'
 
 export default class ExampleComponent extends Component {
@@ -16,6 +18,7 @@ export default class ExampleComponent extends Component {
     return (
       <div className={styles.test}>
         Example Component: {text}
+        <ReactIcon />
       </div>
     )
   }