Append or prepend name to file and component name.

[johnpittman]

Due to naming conflicts I would like to be able to append "Icon" to the file and component name. Having an option such as --postfixName or --prefixName that would do that would be great.

[TrySound]

I found a better solution. I'm currently working on this feature #161

Locally I for a while generate this file. Namespace works like prefix.

import * as icons from '../../icons';

Otherwise you may generate default export like in builtin template and import it with any name you want

import PersonIcon from '../../icons/Person.js';

[johnpittman]

What about the ability to export each to a folder as index.ext? I need this too so that I can generate a docz for each to be able to see what the icon looks like in my living library.

[johnpittman]

This is why I need to be able to change the generated name:

"error  Shadowing of global property 'Infinity'  no-shadow-restricted-names"

[TrySound]

I don't get tbh. Could you show an example?

[johnpittman]

Creating nonverbose function names with common names polite global scope. Infinity is a global variable and it's a font from don't awesome. Need InfinityIcon NameIcon

…

On Sun, Sep 9, 2018, 6:46 AM Bogdan Chadkin ***@***.***> wrote: I don't get tbh. Could you show an example? — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#168 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AGAaayq3UBUNoATRZsd8krRT5M914y1wks5uZP96gaJpZM4WgNsJ> .

[TrySound]

I dont get why this does not fit your needs?

import PersonIcon from '../../icons/Person.js';

Or which global scope you mean? Window one?

[johnpittman]

The file generated contained a defined function. export default const Infinity...

…

On Sun, Sep 9, 2018, 2:22 PM Bogdan Chadkin ***@***.***> wrote: I dont get why this does not fit your needs? import PersonIcon from '../../icons/Person.js'; Or which global scope you mean? Window one? — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#168 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AGAaa75Q6RqXRLa0HzLUVTcJlf-f9bd_ks5uZWpZgaJpZM4WgNsJ> .

[johnpittman]

Or just have it export the function without a name. On Sun, Sep 9, 2018, 3:17 PM John Pittman <johnrichardpittman@gmail.com> wrote:

…

The file generated contained a defined function. export default const Infinity... On Sun, Sep 9, 2018, 2:22 PM Bogdan Chadkin ***@***.***> wrote: > I dont get why this does not fit your needs? > > import PersonIcon from '../../icons/Person.js'; > > Or which global scope you mean? Window one? > > — > You are receiving this because you authored the thread. > Reply to this email directly, view it on GitHub > <#168 (comment)>, > or mute the thread > <https://github.com/notifications/unsubscribe-auth/AGAaa75Q6RqXRLa0HzLUVTcJlf-f9bd_ks5uZWpZgaJpZM4WgNsJ> > . >

[TrySound]

Export without name is bad for debugging. Which global scope do you mean? Modules are isolated from each other. Be more descriptive please. It's not clear what are you trying to achieve.

[johnpittman]

Don't file A is named Infinity.svg I would like ache to spit out InifityIcon.js with the react component function InfinityIcon()... You are correct about debugging which is also why a way to alter the output name is good. If I have a component somewhere else in my app called "Display" and there's an icon file that spits out as const Display = ()... Then they both have the same displayName in react. Still not clear?

…

On Sun, Sep 9, 2018, 3:55 PM Bogdan Chadkin ***@***.***> wrote: Export without name is bad for debugging. Which global scope do you mean? Modules are isolated from each other. Be more descriptive please. It's not clear what are you trying to achieve. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#168 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AGAaayE4xczWueqhxGphY169Lm4GB8a2ks5uZYAwgaJpZM4WgNsJ> .

[johnpittman]

F'ing autocomplete is making this a bit harder. I am on my phone traveling. Sorry. ache=svgr. On Sun, Sep 9, 2018, 5:17 PM John Pittman <johnrichardpittman@gmail.com> wrote:

…

Don't file A is named Infinity.svg I would like ache to spit out InifityIcon.js with the react component function InfinityIcon()... You are correct about debugging which is also why a way to alter the output name is good. If I have a component somewhere else in my app called "Display" and there's an icon file that spits out as const Display = ()... Then they both have the same displayName in react. Still not clear? On Sun, Sep 9, 2018, 3:55 PM Bogdan Chadkin ***@***.***> wrote: > Export without name is bad for debugging. Which global scope do you mean? > Modules are isolated from each other. Be more descriptive please. It's not > clear what are you trying to achieve. > > — > You are receiving this because you authored the thread. > Reply to this email directly, view it on GitHub > <#168 (comment)>, > or mute the thread > <https://github.com/notifications/unsubscribe-auth/AGAaayE4xczWueqhxGphY169Lm4GB8a2ks5uZYAwgaJpZM4WgNsJ> > . >

[TrySound]

As a simple solution you may modify template like this

import { getProps } from './util'

export const getProps = config => {
  const props = []
  if (config.ref) props.push('svgRef')
  if (config.titleProp) props.push('title')
  if (config.expandProps) props.push('...props')

  if (props.length === 0) return '()'
  if (props.length === 1 && config.expandProps) return 'props'

  return `({ ${props.join(', ')} })`
}

const reactDomTemplate = (code, config, state) => `
import React from 'react'

// Here you simply modify icon name
// sure filename is not changed but at least your auto import feature should work
export default function ${state.componentName}Icon${getProps(config)} {
  return ${code}
}
`