Error: You may need an appropriate loader to handle this file type.

[tonyalaribe]

At runtime, I get the following error. I think it might be due to style documents, such as sass in your code, which my app has no loader for. I havent dived into your source, so i cant be specific

ERROR in ./~/react-file-base64/src/js/components/react-file-base64.js
Module parse failed: /Users/macbook/go/src/github.com/tonyalaribe/titterv2/node_modules/react-file-base64/src/js/components/react-file-base64.js Unexpected token (68:6)
You may need an appropriate loader to handle this file type.
|   render(){
|     return (
|       <input
|         type="file"
|         onChange={ this.handleChange.bind(this) }
 @ ./app/containers/NewPost/index.js 52:0-43
Child html-webpack-plugin for "index.html":

[lrojas94]

Did you manage to solve this?

[BosNaufal]

Hey @lrojas94, @tonyalaribe
I don't know what's wrong with that? Did I do wrong? 😕

[lrojas94]

Actually, I was testing out. Still not sure why that happens, but just taking your FileBase64 class file works just fine :P. I don't really know much about node module builds, let alone webpack ones, but I suppose it's related so some dependencies and how you call them.

[BosNaufal]

@lrojas94 :(
Maybe it's caused by the sass file... I think, I need learn more about css in JS. So, the developer is not required to has sass loader in his projects.

[vinodsobale]

I have the same issue

[BosNaufal]

Hey Guys @tonyalaribe @Vinu123 @lrojas94

You can review my last update to fix this issue 1f246e9 And please close this issue after it's solved 😁

Just tell me if there's something wrong...

[mifrej]

I'm having similar error

ERROR in ./~/react-file-base64/src/js/components/react-file-base64.js
Module parse failed: /Users/mfrejnik/www/react-comments/node_modules/react-file-base64/src/js/components/react-file-base64.js Unexpected token (70:6)
You may need an appropriate loader to handle this file type.
SyntaxError: Unexpected token (70:6)
    at Parser.pp$4.raise (/Users/mfrejnik/www/react-comments/node_modules/webpack/node_modules/acorn/dist/acorn.js:2221:15)
    at Parser.pp.unexpected (/Users/mfrejnik/www/react-comments/node_modules/webpack/node_modules/acorn/dist/acorn.js:603:10)
    at Parser.pp$3.parseExprAtom (/Users/mfrejnik/www/react-comments/node_modules/webpack/node_modules/acorn/dist/acorn.js:1822:12)
    at Parser.pp$3.parseExprSubscripts (/Users/mfrejnik/www/react-comments/node_modules/webpack/node_modules/acorn/dist/acorn.js:1715:21)
    at Parser.pp$3.parseMaybeUnary (/Users/mfrejnik/www/react-comments/node_modules/webpack/node_modules/acorn/dist/acorn.js:1692:19)
    at Parser.pp$3.parseExprOps (/Users/mfrejnik/www/react-comments/node_modules/webpack/node_modules/acorn/dist/acorn.js:1637:21)
    at Parser.pp$3.parseMaybeConditional (/Users/mfrejnik/www/react-comments/node_modules/webpack/node_modules/acorn/dist/acorn.js:1620:21)
    at Parser.pp$3.parseMaybeAssign (/Users/mfrejnik/www/react-comments/node_modules/webpack/node_modules/acorn/dist/acorn.js:1597:21)
    at Parser.pp$3.parseParenAndDistinguishExpression (/Users/mfrejnik/www/react-comments/node_modules/webpack/node_modules/acorn/dist/acorn.js:1861:32)
    at Parser.pp$3.parseExprAtom (/Users/mfrejnik/www/react-comments/node_modules/webpack/node_modules/acorn/dist/acorn.js:1796:19)
 @ ./src/components/Main.js 15:21-49
webpack: Failed to compile.

I tried to install it in 2 different projects, with no success.
The version I have include your fix with removing sass fille

[johhansantana]

Hey Guys @tonyalaribe @Vinu123 @lrojas94

You can review my last update to fix this issue 1f246e9 And please close this issue after it's solved 😁

Just tell me if there's something wrong...

I installed via npm which results in this version:
"react-file-base64": "^1.0.2",

This still gives me the error.

[divined]

the same

[vinodsobale]

Solution:
import only react-file-base64.js component. You can find that under src/js/components/react-file-base64.js

[lrojas94]

Check PR #4. The issue should be solved now :) I posted some info about why and what was happening. The reason why @Vinu123 solution works, is because of what I posted in the PR.

[wilfredjonathanjames]

Still the same for react-file-base64@latest(1.0.2) - if this contains your changes:

ERROR in ./~/react-file-base64/src/js/components/react-file-base64.js
Module parse failed: /Users/wilfred.godfrey/www/ffxnz-quiz-authoring-frontend/node_modules/react-file-base64/src/js/components/react-file-base64.js Unexpected token (70:6)
You may need an appropriate loader to handle this file type.
...

It seems to be complaining about the jsx, though I have jsx babel transpiling working in the rest of the project.

[lrojas94]

@wjagodfrey Just use either my repo or the PR #4 I made which works:

npm install https://github.com/lrojas94/react-file-base64

[AlexanderKozhevin]

Same problem, But
@lrojas94 your updates works perfect 👍

[lrojas94]

I've uploaded a package just so in case anyone else encounters the issue here:

https://github.com/lrojas94/react-file-base64

You can install it using npm install react-filebase64. Hopefully the author will update this sometime, but it's been almost a year since this issue was opened, so I thought it would be nice to use an actual package rather than a github link :)