Would like documentation on how to use this with Webpack

[elmarsto]

I know from the README.md that it's expected to use brunch with this, but I frankly dislike brunch intensely, and my attempts to get this working with Webpack 3 have failed.

It would be nice to see some demos of how to do it correctly :)

There is also a possible bug in expose-loader which is to blame for my misery, documented by me here at https://github.com/webpack-contrib/expose-loader/issues/62

[grounded-warrior]

+1 to this, cant seem to get the babel loader working, keep getting

ERROR in ./js/components/MyComponent.jsx
Module parse failed: 
/api/assets/js/components/MyComponent.jsx Unexpected 
token (5:2)
You may need an appropriate loader to handle this file type.

with

{
    test: /\.(js|jsx)$/,
    exclude: '/assets/node_modules/',
    loader: 'babel-loader',
    query: {
      presets: ['react'],
    },
  },

[geolessel]

To be honest, this isn't very high on my list at the moment. I don't have a lot of experience with webpack (though we just started using with our Rails project where I work). If someone has information on how to get it working with webpack, I'd be happy to add that to the README.

[grounded-warrior]

Ok I got it working like this https://gist.github.com/grounded-warrior/c3d127dfc476f2457bff188280bbe5d0

[tmepple]

Webpack has replaced Brunch as the standard for upcoming Phoenix 1.4... https://github.com/phoenixframework/phoenix/pull/2779

Hopefully this would also make re-adding the SSR feature easier as webpack is much more widely used, but really not sure.

[geolessel]

🤔 I guess I'll have to look into webpack now. 😆

[geolessel]

@tmepple @grounded-warrior @1attice Can you three help be guinea pigs for the Webpack transition with this? I've added a webpack branch to the repo that updates the README and mix.exs files to work with the master branch of Phoenix which uses Webpack instead of Brunch. I'd love to know how/if the new branch works for you in both Phoenix master and/or Phoenix 1.3 with Brunch manually replaced with Webpack.

I've tested locally and got it working with Phoenix master, but I'd love more eyes/hands on it before Phoenix 1.4 launches. Thanks for any help you can provide!

https://github.com/geolessel/react-phoenix/tree/webpack

[tmepple]

Changes look good to me so far... thanks for getting the ball rolling in time for Phoenix 1.4.

I've been using react-phoenix tracking Phoenix master for a few months now. Besides README changes the only thing that's required besides adding the proper npm packages for react is adding react to .babelrc which you've already done.

Two quick things...

Have you considered replacing Poison for Jason? Every little perf speedup counts especially if we are serializing a large amount of data/props and it seems the large projects in the ecosystem (phoenix, ecto, etc) are adopting it by default. At least it maybe could be configurable which JSON engine to use?

Also I saw the new note about SSR... not sure how you were planning on approaching it but have you seen what @bryanjos is doing with https://github.com/revelrylabs/elixir_react_render? I think the plan is to launch a configurable pool of node.js server-side workers to perform rendering. I haven't studied it closely enough to know if it would work here but it definitely looks like an interesting approach.

[geolessel]

@tmepple thanks for the feedback. I've merged the webpack update into master and released 1.0.0. I've also, thanks to your suggestion, moved to Jason as the json parser.

37