search

kristerkari / react-native-svg-transformer

Import SVG files in your React Native project the same way that you would in a Web application.
MIT License
1.54k stars 116 forks source link

Expo 50 Solution #344

Closed akhockey21 closed 3 months ago

akhockey21 commented 3 months ago

I'm on a tight timeline and can't open a PR at the moment for the Readme but for expo 50 I have a solution based off their documentation.

  1. Un-do any changes you did to the metro.config file as a result of this package.
  2. Add a new root file metro.transformer.js
  3. Paste the following and you're done.
const upstreamTransformer = require("@expo/metro-config/babel-transformer");
const svgTransformer = require("react-native-svg-transformer");

module.exports.transform = async ({ src, filename, options }) => {
  // Use react-native-svg-transformer for SVG files
  if (filename.endsWith(".svg")) {
    return svgTransformer.transform({ src, filename, options });
  }
  // Pass the source through the upstream Expo transformer for other files
  return upstreamTransformer.transform({ src, filename, options });
};