Error Unexpected token

[rafaelaudax]

As you can see in the image, there is an error inside the index.js file of the lib

Versions:

Stack	Version
@react-simply/state	1.0.2
react	16.8.6
node	11.13.0
npm	6.7.0
yarn	1.15.2

[artdevgame]

Think this just needs the extension changing to .jsx

[movingelectrons]

I get a very similar error.

ERROR in ./node_modules/@react-simply/state/src/index.js 7:2 Module parse failed: Unexpected token (7:2) You may need an appropriate loader to handle this file type. | | export const StateProvider = ({ reducer, initialState, children }) => (

<StateContext.Provider value={useReducer(reducer, initialState)}> | {children} | </StateContext.Provider> @ ./src/components/App.js 15:13-43 @ ./src/index.js @ multi webpack/hot/dev-server ./src/index.js

I tried changing ./node_modules/@react-simply/state/src/index.js to .jsx but did not work...

[lukashala]

Renaming to .jsx is not solution.

The reason for this is that it's not transpiled to ES6. You should setup your babel/webpack to transpile this package to ES6. Maybe I will add transpiled version here later (no promises).

[lukashala]

Something like this in your webpack config should help;

module: {
  rules: [
    {
      test: /\.js$/,
      exclude: /node_modules\/(?!(@react-simply)\/).*/,
      loader: 'babel-loader'
    }
  ]
}

[jeffscottward]

I'm using next.js which has all the bells and whistles with zero config and I get this issue too

[rafaelaudax]

Something like this in your webpack config should help;

module: {
  rules: [
    {
      test: /\.js$/,
      exclude: /node_modules\/(?!(@react-simply)\/).*/,
      loader: 'babel-loader'
    }
  ]
}

Thanks for the attention, it is a good temporary solution, but I believe that for a distributed library, it would be interesting to provide an already compiled bundle, since in applications created using the create-react-app we do not have access to webpack configuration in a simple way.

[jeffscottward]

I have used NWB (https://github.com/insin/nwb) in the past with pretty good success for doing transpiling for deployment to a NPM. Hopefully that helps.

On Mon, May 20, 2019 at 10:53 AM rafaelaudax [email protected] wrote:

Something like this in your webpack config should help;

module: { rules: [ { test: /.js$/, exclude: /node_modules/(?!(@react-simply)/).*/, loader: 'babel-loader' } ] }

Thanks for the attention, it is a good temporary solution, but I believe that for a distributed library, it would be interesting to provide an already compiled bundle, since in applications created using the create-react-app we do not have access to webpack configuration in a simple way.

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/lukashala/react-simply/issues/2?email_source=notifications&email_token=AAJUO7UNEBHJJFU7O4UW47LPWK3PLA5CNFSM4HC2LR62YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGODVZCX5Q#issuecomment-494021622, or mute the thread https://github.com/notifications/unsubscribe-auth/AAJUO7QPDWEQAE3K7C74OBTPWK3PLANCNFSM4HC2LR6Q .

-- Thanks, Jeff Ward Front-end Developer Tel: 516-551-8624 [email protected] [email protected] @jeffscottward https://twitter.com/#!/jeffscottward

[victorcarvalhosp]

How can I get this to work with a new create-react-app project with typescript? I don't know in which file I should put the code above... Appreciate any help!

[jeffscottward]

@victorcarvalhosp you would need to "eject" so you can get access to the webpack config. Ideally you should not have to do this and it should just work. Hence my suggestion the author use NWB. I may for this and point to mine if he doesn't get this handled in the next week or so. I think its genius.

[choskins780]

I was not able to modify the webpack config successfully from a new create-react-app project to get this working properly, I still receive the same error. I have experience with webpack and still cannot seem to get this working properly, please advise. Be more specific like the exact file location we should be editing for a new create-react-app and where this edit should be placed very specifically inside the configuration. Every person I know uses create-react-app so the fact this step is even a thing is pretty discouraging. If you can at least give more detailed directions people can get up and going with it quickly. Currently this library is unusable for me until I can get this working.

[lukashala]

Hi @choskins780, this was just a first shot I did. I plan to release completely new version with some improvements. Meanwhile you can just copy those few lines of code (it's 10 lines actually, without comments and spacing) directly into your project. There is no need to put this package as a dependency ;)