buttons / react-github-btn

:octocat: Unofficial github:button component for React.js
https://buttons.github.io
BSD 2-Clause "Simplified" License
62 stars 8 forks source link

Module Parse Failed... You may need an appropriate loader to handle this file type #8

Closed meerkat-citronella closed 3 years ago

meerkat-citronella commented 3 years ago

Getting this error code when I try to run the example in the readme:

./node_modules/react-github-btn/index.js
Module parse failed: Unexpected token (10:83)
You may need an appropriate loader to handle this file type.
|   }
|   render () {
|     return React.createElement('span', { ref: this.$ }, React.createElement('a', { ...this.props, ref: this._ }, this.props.children))
|   }
|   componentDidMount () {

My code:

import GitHubButton from "react-github-btn";

return (
...
<GitHubButton href="https://github.com/meerkat-citronella">
  Follow @meerkat-citronella
</GitHubButton>
... 
)

my package.json:

{
    "name": "portfolio",
    "version": "0.1.0",
    "private": true,
    "dependencies": {
        "chart.js": "^2.7.2",
        "cosmicjs": "^3.2.12",
        "react": "^16.12.0",
        "react-chartjs-2": "^2.11.1",
        "react-dom": "^16.12.0",
        "react-github-btn": "^1.2.0",
        "react-redux": "^5.0.7",
        "react-router": "^4.2.0",
        "react-router-dom": "^4.2.2",
        "react-scripts": "1.1.1",
        "react-typeform-embed": "^0.1.6",
        "redux": "^3.7.2",
        "semantic-ui-css": "^2.3.0",
        "semantic-ui-react": "^0.82.1",
        "styled-components": "^5.1.1"
    },
    "scripts": {
        "start": "react-scripts start",
        "build": "react-scripts build",
        "test": "react-scripts test --env=jsdom",
        "eject": "react-scripts eject",
        "deploy": "gh-pages -d build"
    },
    "homepage": ".",
    "devDependencies": {
        "gh-pages": "^1.2.0"
    }
}
meerkat-citronella commented 3 years ago

Update: the module seems to work fine on a newly-created React app.

It's still not working on my project tho, even after updating react and react-dom to ^17.0.1. Same error.

ntkme commented 3 years ago

The issue is likely that you have old version of react-scripts.

ntkme commented 3 years ago

You need at least react-scripts>=2.0.3, ideally upgrade it to latest version if possible.

Here is the critical commit that makes the difference if you're interested: https://github.com/facebook/create-react-app/commit/3d4440812c62e692019f72503a60c6240df2f805

meerkat-citronella commented 3 years ago

I'll take your word for it re: react-scripts... my app is having trouble updating to the latest version. I ended up not using the module anyway, as I needed the buttons to be larger than the largest size offered. So i made my own components. But thanks for the prompt response anyway! cheers.