I wish we had something like this officially backed by the react team. In 30 minutes when a new standard approach comes out, this tool will become obsolete.
What do you mean? I've heard people say that a couple times but they never really elaborated. Do people love their semicolons that much? Are people offended that it's called "standard"? Or something else?
> They are specifically working on it according to this React.js Conf talk
This is very exciting. I prefer React over Vue, but one of the things I love about Vue is vue-cli[0]. Something similar, if not better, for React, would be greatly appreciated.
Tbf I just looked over 'standard' and it's improved a ton since it initially came out. Bar one minor rule, the only rule I still object to is the semicolon one, which I'm obvs not going to get into a discussion about, because I value my sanity. I'll edit my above comment if I still can :)
Semis aside, I take issue with the name and the badge[0], making it seem like _the_ style of writing JS instead of just _a_ style. The contents of the project are fine, but this aspect is misleading for people new to JS.
It's interesting how the Facebook team decided to do a built-in all-in-one opinionated CLI for React Native but never did for regular React. Hope they get around to this soon.
would love more "explicit (in code) best practices" if possible even a "recommended default approach"
i understand that a full "framework" is not the way to for the community. but a few default standards would be good as guidance for newcomers and to manage expectations of coders coming into existing projects
I don't think you're reading the situation accurately. Debating and improving our development tools is a sport across the entire field of programming.
The status quo already is to keep on using what we're using. That doesn't need to be said. But if it wasn't for our endless search for nirvana, people would be stuck on Vim and 4-space tabs.
Just a small utility for people who are tired of remembering what babel presets or Webpack loaders they need to build a relatively up to date React project.
Looks good! We've been working on something similar at reddit, https://github.com/reddit/node-build, to solve the same issue. It has defaults for react/es6, and I'm also using it without react for building es6 libraries for NPM distribution.
Nice work! I've been looking for something like this.
I hope to see more tools in this vein emerge from the JavaScript ecosystem - tools that aren't afraid to make some well-reasoned assumptions for the sake of a more minimal interface. (It seems like every tool nowadays wants you to put another dotfile or garbage.json at the root of your project.)
I would love this only for the react stuff. More useful defaults, less opinions. For example: please let me chose my own CSS workflow and please don't force me to write javascript without semicolons like an animal :P.
Update: I just realised that you can bypass the linter and the postcss. I am sorry OP, looks like I'm a lazy jackass.
likewise redux, redux thunks and wireup for router would probably be beneficial as a starting point. Of course at that point, pretty much wandering into starter project territory.
Most of the modules involved are development side resources that don't end up included in the build. Complaining about the number of modules is like installing visual studio, noticing that it takes several gigs on disk and being like "Gigabytes, for a hello world program?"
But if you're using React you are creating a not-insignificant webapp and the initial install time of 177 modules is totally irrelevant beyond that first install. It doesn't have any reflection on the size of the client JS file (webpack loaders, for example, only live on the dev machine).
Moreover, you can presumably globally install this, so it can cover every React-based project you need to build.
It's just an example to show what type of code `reactpack` builds, ES6 and JSX with style loading in this case. If you want a more minimal React-like build you can switch out React with lightweight alternatives like Preact or React-lite.
For reference, I build a standalone datepicker module with preact + redux at under 20kb (min + gz)... worked out really well. By comparison, went with regular react recently, and the payload quickly got over 200kb, though I needed a couple relatively heavy libraries for the app in question.
Another point worth mentioning is using react-icons individually (svg based), same for component libraries where you are only using a few components... tends to work out much lighter. Also, if you do use bootstrap as a base css library, work from the source instead of monkey patching the .css output.
It could just be spinning - Babel 6 presets install _lots_ of duplicated dependencies with npm2.
I need to move a similar project from Babel 5 to Babel 6 soon and tried manually deduplicating Babel 6 preset dependencies for better npm2 support [1] - doing so reduced the size of node_modules/ from ~120MB to ~6MB!