Allow for the loading of inline SVGs / update example

[jptaylor]

Feature request

If you want to load an SVG inline, e.g. import ExampleIcon from "icons/example.svg"; using inline-react-svg (as per the example in the repo found here ) and you are using absolute imports, the files will with not resolve.

Inline SVGs are quite common in modern web development and it currently requires a lot of config and additional packages in order to make work.

Additional context

You can fix this issue by installing the babel-plugin-module-resolver package and updating your .babelrc file as followings:

{
  "presets": ["next/babel"],
  "plugins": [
    ["module-resolver", { "root": ["./src"] }],
    ["styled-components", { "ssr": true }],
    "inline-react-svg"
  ]
}

Proposed solution

Support the loading of SVG components by default (i.e. in the NextJS internals) without needing to manually update .babelrc