Version 2 #234
Version 2 #234
Conversation
devinivy
commented
Sep 30, 2019
devinivy
commented
- Update to depend on node v10/12.
- Update to webpack v4.
- Reorganize webpack configuration.
- Update babel deps to use new loaders and @babel-scoped packages.
- Update eslint and related plugin/config deps.
- Remove npm-better-run.
- Remove bin/ folder (if practical under webpack v4).
- Remove layouts/ folder.
- Remove redux-cli and blueprints.
- Remove nodemon.
- Replace mocha/chai/karma/sinon/enzyme testing suite with jest and @testing-library/react.
- Incorporate styled-components as the default CSS solution, removing previous config/deps related to CSS.
- Incorporate strange-middle-end and remove old middle-end deps such as keymirror.
- Move from react-router-redux to connected-react-router.
- Decouple router parent component from rendered routes.
- Default 404 and error boundary.
- Update docs.
| module.exports = ({ store, Router = ConnectedRouter, ...routerProps }) => { | ||
|
|
||
| return ( | ||
| <ErrorBoundary FallbackComponent={ErrorFallback}> |
| <> | ||
| <h3>Oops! Something went wrong.</h3> | ||
| <h4> | ||
| You can keep browsing or try{' '} |
There was a problem hiding this comment.
pardon if it's just something I'm unaware of, heh!
There was a problem hiding this comment.
I need to add a space between try and the <button /> element on the next line. The way JSX whitespace works, this seemed like the most direct way to do it to me, but I agree it's kinda awkward.
There was a problem hiding this comment.
Strange how the braces issue doesn't complain about this but complains about the other, /shrug
| node: true | ||
| }, | ||
| plugins: [ | ||
| 'jsx-a11y', |
There was a problem hiding this comment.
I just stumbled into this as well, hadn't used it yet. 🤔 👍
There was a problem hiding this comment.
If anyone else is wondering, a11y stands for accessibility. The number in the middle is how many letters are in there. In the same vein i18n stands for internationalization
package.json
Outdated
| "version": "0.0.0", | ||
| "description": "How I Learned to Stop Worrying and Love React", | ||
| "version": "2.0.0", | ||
| "description": "My webpack project", |
There was a problem hiding this comment.
Are we gonna change the desc?
There was a problem hiding this comment.
Good catch! I'm thinking it might make sense to clear it out altogether.
There was a problem hiding this comment.
Gonna go ahead and remove this
| CounterRoute(store) | ||
| ] | ||
| }]); | ||
| const CounterPage = React.lazy(() => import('./counter/containers/CounterPage')); |
src/components/Header.js
Outdated
| <div> | ||
| <h1>Strangeluv</h1> | ||
| <Link exact to='/'>Home</Link> | ||
| {' · '} |
There was a problem hiding this comment.
This line causes a "Failed to compile" error for me:
Line 15:13: Curly braces are unnecessary here react/jsx-curly-brace-presence
There was a problem hiding this comment.
I think the behavior might have changed when they fixed this issue: jsx-eslint/eslint-plugin-react#2423 . Hmm...
If they are unnecessary, do you mind removing them? If they are necessary and this is a false positive, you can downgrade eslint-plugin-react prior to the bug was introduced.
There was a problem hiding this comment.
It also might have an autofix worth trying!
There was a problem hiding this comment.
It's probably this bug that has a fix that hasn't been released yet: jsx-eslint/eslint-plugin-react#2427
When this PR went-up it definitely compiled fine and passed the CI checks. In the past couple days eslint-plugin-react has made several changes to this particular lint rule, so I expect they are working out some kinks. I would recommend downgrading locally for now until things settle there. Try npm install --save-dev eslint-plugin-react@7.14.3.
There was a problem hiding this comment.
Downgrading eslint-plugin-react didn't actually do it, but downgrading eslint did the trick for now.
There was a problem hiding this comment.
Huh, pretty odd! Glad you worked around it for now.
There was a problem hiding this comment.
I ran into this same issue, even after upgrading to v7.16.0 which was supposed to fix it (This PR jsx-eslint/eslint-plugin-react#2431)
Someone else commented that it actually didn't fix the issue and they opened a new one. Last comment was 3 hours ago jsx-eslint/eslint-plugin-react#2454)
There was a problem hiding this comment.
I don't want to spend too much time on this. I put in a temp fix and comment about it by declaring a var for this
const divider = ' · ';
...
{divider}
There was a problem hiding this comment.
This part of the code is changed in Tyler's material branch anyway so we'll be fine
