svgr.config.js 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
  1. // eslint-disable-next-line @typescript-eslint/no-var-requires
  2. const path = require('path')
  3. module.exports = {
  4. template: componentTemplate,
  5. indexTemplate: indexTemplate,
  6. typescript: true,
  7. memo: true,
  8. ref: true,
  9. prettier: true,
  10. jsxRuntime: 'automatic',
  11. svgoConfig: {
  12. plugins: [
  13. {
  14. name: 'preset-default',
  15. params: {
  16. overrides: {
  17. removeViewBox: false,
  18. cleanupIDs: false, // Figma already assigns unique ID for every SVG. With this option enabled, the IDs are no longer globally unique
  19. },
  20. },
  21. },
  22. ],
  23. },
  24. }
  25. const comment = '// THIS FILE WAS AUTOGENERATED BY SVGR. DO NOT MODIFY IT MANUALLY'
  26. function componentTemplate(variables, { tpl }) {
  27. return tpl`
  28. ${comment}
  29. ${variables.imports}
  30. ${variables.interfaces}
  31. const ${variables.componentName} = forwardRef((${variables.props}) => (
  32. ${variables.jsx}
  33. ))
  34. ${variables.componentName}.displayName = '${variables.componentName}'
  35. const Memo = memo(${variables.componentName})
  36. export { Memo as ${variables.componentName} }
  37. `
  38. }
  39. function indexTemplate(filePaths) {
  40. const exportEntries = filePaths.map((filePath) => {
  41. const basename = path.basename(filePath, path.extname(filePath))
  42. return `export * from './${basename}'`
  43. })
  44. return comment + '\n' + exportEntries.join('\n') + '\n'
  45. }