docs(5.x): update svg.md

website/src/5.x/docs/guides/svg.md

@@ -1,18 +1,18 @@
 # SVG support
 
-By default, Re.Pack's [Assets loader](../loaders/assets-loader) is configured to allow you to import SVGs in you code, but that doesn't mean you can render them immediately.
+By default, Re.Pack's [Assets loader](../../api/loaders/assets-loader) is configured to allow you to import SVGs in you code, but that doesn't mean you can render them immediately.
 
 ## Pre-requisites
 
 To render SVGs in your application, you first need to add [`react-native-svg`](https://github.com/react-native-svg/react-native-svg) native module to your application.
 
-Please follow this installation instructions here: https://github.com/react-native-svg/react-native-svg#installation
+Please follow this installation instructions [here](https://github.com/react-native-svg/react-native-svg#installation).
 
 ## Exclude SVG from Re.Pack's Assets loader
 
-Now that you have [`react-native-svg`](https://github.com/react-native-svg/react-native-svg) installed and linked into the application, you need to tell Webpack **not to use** Re.Pack's [Assets loader](../loaders/assets-loader) from processing SVGs, since you will process them manually later.
+Now that you have [`react-native-svg`](https://github.com/react-native-svg/react-native-svg) installed and linked into the application, you need to tell Rspack (or webpack) **not to use** Re.Pack's [Assets loader](../loaders/assets-loader) from processing SVGs, since you will process them manually later.
 
-Go to your Webpack configuration and apply the following diff:
+Go to your Rspack/webpack configuration file and apply the following diff:
 
 ```diff
       {
@@ -26,11 +26,11 @@ Go to your Webpack configuration and apply the following diff:
 
 :::tip
 
-If you don't have Re.Pack's Assets loader rule in your Webpack config, read [this guide](../loaders/assets-loader#migrating-from-assetsplugin) first.
+If you don't have Re.Pack's Assets loader rule in your Rspack/webpack config, read [this guide](../loaders/assets-loader#migrating-from-assetsplugin) first.
 
 :::
 
-Now you need to tell Webpack how to handle `.svg` files.
+Now you need to tell Rspack/webpack how to handle `.svg` files.
 
 ## Using `@svgr/webpack`
 
@@ -50,10 +50,9 @@ export function MyComponent() {
 
 To use SVGR, you need to add an additional rule to process SVGs with `@svgr/webpack` loader.
 
-Go to your Webpack configuration and apply the following diff:
+Go to your Rspack/webpack configuration and apply the following diff:
 
-```diff
-// webpack.config.js
+```diff title="rspack.config.js"
 module.exports = {
   // ...
   module: {
@@ -85,15 +84,15 @@ Thanks to the rule above, your SVGs will be processed by `@svgr/webpack` and con
 from [`react-native-svg`](https://github.com/react-native-svg/react-native-svg) allowing you to simply
 import the component and render it as a React component.
 
-## Using Webpack's asset modules
+## Using asset modules
 
-Using Webpack's asset modules is a simpler and faster way to render SVGs in your application.
+Using Rspack/webpack's asset modules is a simpler and faster way to render SVGs in your application.
 It's a good option, if you don't need or care about using the imported SVG as React component,
 and you're fine with using `SvgXml` or `SvgUri` component from [`react-native-svg`](https://github.com/react-native-svg/react-native-svg).
 
 :::info
 
-You can read more about Webpack's asset modules here: https://webpack.js.org/guides/asset-modules/.
+You can read more about Rspack/webpack's asset modules [here](https://rspack.dev/guide/features/asset-module).
 
 :::
 
@@ -129,10 +128,9 @@ export function MyComponent() {
 
 To use asset modules, you need to add additional rule to process SVGs as an asset module.
 
-Go to your Webpack configuration and apply the following diff:
+Go to your Rspack/webpack configuration and apply the following diff:
 
-```diff
-// webpack.config.js
+```diff title="rspack.config.js"
 module.exports = {
   // ...
   module: {
@@ -157,10 +155,10 @@ Now you can import the XML of your SVG in you code and render it using `SvgXml`
 If you want to inline SVGs as data URI, use `asset/inline` in the rule:
 
 ```js
-      {
-        test: /\.svg$/,
-        type: 'asset/inline',
-      },
+{
+  test: /\.svg$/,
+  type: 'asset/inline',
+},
 ```
 
 Remember to use `SvgUri` for inlined SVGs instead of `SvgXml`.
@@ -169,8 +167,7 @@ Remember to use `SvgUri` for inlined SVGs instead of `SvgXml`.
 
 You can also use both, `asset/source` and `asset/inline` in your application:
 
-```diff
-// webpack.config.js
+```diff title="rspack.config.cjs"
 module.exports = {
   // ...
   module: {
@@ -197,13 +194,12 @@ module.exports = {
 :::tip
 
 When using both `assets/source` and `assets/inline`, you can specify different `test`, `include` and `exclude` values,
-so that Webpack can figure out which mechanism to use for which SVG. You can read more about rule conditions here:
+so that Rspack/webpack can figure out which mechanism to use for which SVG. You can read more about rule conditions here:
 
-- https://webpack.js.org/configuration/module/#rule-conditions
-- https://webpack.js.org/configuration/module/#ruleinclude
-- https://webpack.js.org/configuration/module/#ruleexclude
-- https://webpack.js.org/configuration/module/#ruletest
-- https://webpack.js.org/configuration/module/#condition
+- [Condition](https://rspack.dev/config/module#condition)
+- [Rule.include](https://rspack.dev/config/module#ruleinclude)
+- [Rule.exclude](https://rspack.dev/config/module#ruleexclude)
+- [Rule.test](https://rspack.dev/config/module#ruletest)
 
 :::