From 88ca088e4b49745a57aba69da615b58e0ed9b458 Mon Sep 17 00:00:00 2001
From: gabimoncha <gabimoncha@gmail.com>
Date: Wed, 6 Jul 2022 21:02:22 +0300
Subject: [PATCH 1/2] Update documentation

---
 README.md | 47 +++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 47 insertions(+)

diff --git a/README.md b/README.md
index 0f55ed5..b47ebe3 100644
--- a/README.md
+++ b/README.md
@@ -227,6 +227,53 @@ module.exports = {
 
 </table>
 
+## Adding support for static assets and svgs
+
+```js
+module.exports = {
+  addons: [
+    /*existing addons,*/
+  ],
+  staticDirs: ['<path_to_assets>'],
+  webpackFinal: async (config) => {
+    const fileLoaderRule = config.module.rules.find(
+      (rule) => rule.test && rule.test.test('.svg')
+    );
+    fileLoaderRule.exclude = /\.svg$/;
+
+    config.module.rules.push({
+      test: /\.svg$/,
+      use: ['@svgr/webpack', 'url-loader'],
+    });
+
+    return config;
+  },
+};
+```
+
+## Adding support for webpack 5
+
+```js
+const NodePolyfillPlugin = require('node-polyfill-webpack-plugin');
+
+module.exports = {
+  addons: [
+    /*existing addons,*/
+  ],
+  core: {
+    builder: 'webpack5'
+  },
+  webpackFinal: async (config) => {
+    // Webpack 5 stops polyfilling Node and you need some of them for react native modules
+    config.plugins.push(
+      new NodePolyfillPlugin()
+    )
+
+    return config;
+  },
+};
+```
+
 ## Known limitations
 
 - Libraries that don't support react-native-web will not work

From 73156f89653dc45b945ed7759d2e85075fb4bc0d Mon Sep 17 00:00:00 2001
From: Daniel Williams <dannyhyunsoowilliams@gmail.com>
Date: Sun, 7 Jan 2024 21:36:12 +0000
Subject: [PATCH 2/2] adjustment

---
 README.md | 31 +++++++++++++++++--------------
 1 file changed, 17 insertions(+), 14 deletions(-)

diff --git a/README.md b/README.md
index f269a92..ae52bab 100644
--- a/README.md
+++ b/README.md
@@ -10,6 +10,8 @@ This addon configures `@storybook/react` to display React Native (RN) projects u
     - [Aliasing react native web libraries](#aliasing-react-native-web-libraries)
     - [Adding babel plugins](#adding-babel-plugins)
   - [Configuring popular libraries](#configuring-popular-libraries)
+  - [Adding support for static assets and svgs](#adding-support-for-static-assets-and-svgs)
+  - [Node polyfills for webpack 5](#node-polyfills-for-webpack-5)
   - [Known limitations](#known-limitations)
 
 See the [FAQ](https://github.com/storybookjs/addon-react-native-web/blob/main/FAQ.md) for common questions.
@@ -232,17 +234,21 @@ module.exports = {
 
 ## Adding support for static assets and svgs
 
+Install `@svgr/webpack` and `url-loader`
+
 ```js
 module.exports = {
-  addons: [
-    /*existing addons,*/
-  ],
+  /*existing config*/
+  // to provide a public export for assets
   staticDirs: ['<path_to_assets>'],
   webpackFinal: async (config) => {
     const fileLoaderRule = config.module.rules.find(
-      (rule) => rule.test && rule.test.test('.svg')
+      (rule) => rule.test && rule.test.test('.svg'),
     );
-    fileLoaderRule.exclude = /\.svg$/;
+
+    if (fileLoaderRule) {
+      fileLoaderRule.exclude = /\.svg$/;
+    }
 
     config.module.rules.push({
       test: /\.svg$/,
@@ -254,23 +260,20 @@ module.exports = {
 };
 ```
 
-## Adding support for webpack 5
+## Node polyfills for webpack 5
+
+install `node-polyfill-webpack-plugin`
 
 ```js
 const NodePolyfillPlugin = require('node-polyfill-webpack-plugin');
 
 module.exports = {
-  addons: [
-    /*existing addons,*/
-  ],
+  /*existing config*/
   core: {
-    builder: 'webpack5'
+    builder: 'webpack5',
   },
   webpackFinal: async (config) => {
-    // Webpack 5 stops polyfilling Node and you need some of them for react native modules
-    config.plugins.push(
-      new NodePolyfillPlugin()
-    )
+    config.plugins.push(new NodePolyfillPlugin());
 
     return config;
   },