search

BosNaufal / react-file-base64

React Component for Converting File to base64
MIT License
158 stars 50 forks source link

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

Closed tonyalaribe closed 7 years ago

tonyalaribe commented 8 years ago

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 commented 8 years ago

Did you manage to solve this?

BosNaufal commented 8 years ago

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

lrojas94 commented 8 years ago

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 commented 8 years ago

@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 commented 7 years ago

I have the same issue

BosNaufal commented 7 years ago

Hey Guys @tonyalaribe @vinu123 @lrojas94

You can review my last update to fix this issue https://github.com/BosNaufal/react-file-base64/commit/1f246e95fff299bffbc7a17133bed6beb9ce9f6d And please close this issue after it's solved :grin:

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

mifrej commented 7 years ago

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 commented 7 years ago

Hey Guys @tonyalaribe @vinu123 @lrojas94

You can review my last update to fix this issue BosNaufal/react-file-base64@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 commented 7 years ago

the same

vinodsobale commented 7 years ago

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

lrojas94 commented 7 years ago

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 commented 7 years ago

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 commented 7 years ago

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

npm install https://github.com/lrojas94/react-file-base64
AlexanderKozhevin commented 7 years ago

Same problem, But @lrojas94 your updates works perfect 👍

lrojas94 commented 7 years ago

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 :)

BosNaufal commented 7 years ago

Hey all! @lrojas94 @tonyalaribe @vinu123 @mfrejnik @johhansantana @wjagodfrey @AlexanderKozhevin @divined.

I'm so sorry for making you waiting for merge... But now it's just been published on npm. Thanks all for your great works! https://github.com/BosNaufal/react-file-base64/pull/4