Extending @wordpress/scripts to load SVG files inside JSX files.

my-component.js

import {
  Component,
  Fragment,
} from '@wordpress/element';

import Icon from './icon.svg';

class MyComponent extends Component {
  render() {
    return (
      <Fragment>
        <p>Let's print an icon...</p>
        <Icon />
      </Fragment>
    );
  }
}

export default MyComponent;

webpack.config.js

const defaultConfig = require("./node_modules/@wordpress/scripts/config/webpack.config");
 
module.exports = {
  ...defaultConfig,
  module: {
    ...defaultConfig.module,
    rules: [
      ...defaultConfig.module.rules,
      {
        test: /\.svg$/,
        issuer: /\.js$/,
        use: [
          {
            loader: 'svg-react-loader',
	  }
        ],
      },
    ],
  },
};