Transformer not working on React Native windows

[jloracudris]

Hello, please help!

Maybe this is a duplicated from this closed issue #115, that ticket did not resolved tho

But im going crazy with this, the thing is that apparently i cannot load an svg to any component, when i try to import it, it finds the svg file BUT it renders an empty object

something like this

import something from './mySomething.svg';
console.log(something)

in the console i see

ReactNative ['index'] (info): '{}'

Notes:

• if i hardcode the SVG in the component and use the SVGXML component it renders correctly
• it works on Android (havent tried it on iOS)

metro.config.js

const { getDefaultConfig, mergeConfig } = require('@react-native/metro-config');

const fs = require('fs');
const path = require('path');
const exclusionList = require('metro-config/src/defaults/exclusionList');

const rnwPath = fs.realpathSync(
    path.resolve(require.resolve('react-native-windows/package.json'), '..'),
);

//

/**
 * Metro configuration
 * https://facebook.github.io/metro/docs/configuration
 *
 * @type {import('metro-config').MetroConfig}
 */

const {
    resolver: { sourceExts, assetExts },
} = getDefaultConfig();

const config = {
    //
    resolver: {
        assetExts: assetExts.filter(ext => ext !== 'svg'),
        sourceExts: [...sourceExts, 'svg'],
        blockList: exclusionList([
            // This stops "npx @react-native-community/cli run-windows" from causing the metro server to crash if its already running
            new RegExp(
                `${path.resolve(__dirname, 'windows').replace(/[/\\]/g, '/')}.*`,
            ),
            // This prevents "npx @react-native-community/cli run-windows" from hitting: EBUSY: resource busy or locked, open msbuild.ProjectImports.zip or other files produced by msbuild
            new RegExp(`${rnwPath}/build/.*`),
            new RegExp(`${rnwPath}/target/.*`),
            /.*\.ProjectImports\.zip/,
        ]),
        //
    },
    transformer: {
        transformer: {
            babelTransformerPath: require.resolve('react-native-svg-transformer/react-native'),
            inlineRequires: true
        },
        resolver: {
            assetExts: assetExts.filter(ext => ext !== 'svg'),
            sourceExts: [...sourceExts, 'svg'],
        },
        getTransformOptions: async () => ({
            transform: {
                experimentalImportSupport: false,
                inlineRequires: true,
            },
        }),
    },
};

module.exports = mergeConfig(getDefaultConfig(__dirname), config);

Also added the declarations.d.ts

package.json

"react-native": "^0.77.0",
"react-native-svg": "^15.11.1",
"react-native-svg-transformer": "^1.5.0",