remcohaszing/babel-plugin-transform-react-class-to-function

ReferenceError

Closed this issue · 3 comments

When i build app console.log just says that ReferenceError: someprop is not defined.

Is that maybe iam using typescript without proptypes? IDK :(

Thanks!

Could you post the code and babel configuration that caused this issue?

Yea sure.
babel conf:

  "babel": {
    "presets": [
      "react-app"
    ],
    "env": {
      "production": {
        "plugins": [

          "babel-plugin-transform-react-class-to-function",
          [
            "transform-remove-console",
            {
              "exclude": [
                "error",
                "warn"
              ]
            }
          ]
        ]
      }
    }
  },

Also it throw errors only on pure class components which need to be compiled to functions:

Screen Shot 2019-04-06 at 1 30 25 PM

For example it failed on Icon component which is pure class component..if i change this to function manualy new error on another component arrive.....

Here is example of componennt which need to be compiled to function:

// core
import * as React from 'react'
// styles
import * as css from './Icon.scss'
export interface IIconProps {
  className?: string
  name: string
  color?: string
  useDesign?: boolean
  useSvg?: boolean
}

export class Icon extends React.Component<IIconProps> {
  render() {
    const { name, color, useDesign, useSvg, className } = this.props

    const style = {
      color,
    }

    let icon = require(`assets/icons/svg/approval.svg`)
    if (useSvg) {
      try {
        icon = require(`../../../assets/icons/svg/${name}.svg`)
      } catch (err) {}
    }
    return useSvg ? (
      <img className={`${css.icon} ${className ? className : ''}`} src={icon} alt={name} />
    ) : (
      <i
        className={`${useDesign ? 'icon-' : 'fe fe-'}${name} ${className ? className : ''}`}
        style={style}
      />
    )
  }
}

Screen Shot 2019-04-06 at 1 34 41 PM

Thanks for helping! :)

Sorry for the late response.

I don’t know the rest of your setup. I have been using this plugin along with TypeScript using @babel/preset-typescript lately, and it works just fine.

I need the input and output for this plugin in order to know what’s going wrong. Right now I can’t even be sure if this plugin is the culprit. I think probably not. Closing this issue for now.