Fixing Eslint configuration

[harish-sethuraman]

What is the problem ?

• The ESLint previously ran smoothly but seems like it didn't run in the beta dir 🤔
• When ever I ran build it was asking to upgrade
  error - Your project has an older version of ESLint installed (6.8.0). Please upgrade to ESLint version 7
• Next.js comes with integrated ESLint and we aren't consuming that 🤔

Solution:

• Revamped Linting and now it works fine. (warnings are thrown and errors have been fixed)
• Also fixed errors for anchor is valid
• Added ESLint for pre commit too.

We might consider adding newer rules as well.

Let me know your thoughts 😄

[github-actions]

Size Changes

Details

📦 Next.js Bundle Analysis

This analysis was generated by the next.js bundle analysis action 🤖

⚠️ Global Bundle Size Increased

Page	Size (compressed)
global	91.26 KB (🟡 +92 B)

Details

The global bundle is the javascript bundle that loads alongside every page. It is in its own category because its impact is much higher - an increase to its size means that every page on your website loads slower, and a decrease means every page loads faster.

Any third party scripts you have added directly to your app using the <script> tag are not accounted for in this analysis

If you want further insight into what is behind the changes, give @next/bundle-analyzer a try!

One Hundred Eighty-five Pages Changed Size

The following pages changed size from the code in this PR compared to its base branch:

Page	Size (compressed)	First Load
/	203.67 KB (🟡 +532 B)	294.93 KB
/404	202.78 KB (🟡 +543 B)	294.04 KB
/blog	37.32 KB (🟢 -601 B)	128.58 KB
/blog/2013/06/02/jsfiddle-integration	213.8 KB (🟢 -44 B)	305.06 KB
/blog/2013/06/05/why-react	215.52 KB (🟢 -49 B)	306.79 KB
/blog/2013/06/12/community-roundup	215.23 KB (🟢 -46 B)	306.49 KB
/blog/2013/06/19/community-roundup-2	215.9 KB (🟢 -47 B)	307.16 KB
/blog/2013/06/21/react-v0-3-3	213.95 KB (🟢 -46 B)	305.21 KB
/blog/2013/06/27/community-roundup-3	216.26 KB (🟢 -48 B)	307.52 KB
/blog/2013/07/02/react-v0-4-autobind-by-default	214.56 KB (🟢 -43 B)	305.83 KB
/blog/2013/07/03/community-roundup-4	215.63 KB (🟢 -47 B)	306.89 KB
/blog/2013/07/11/react-v0-4-prop-validation-and-default-values	214.43 KB (🟢 -46 B)	305.7 KB
/blog/2013/07/17/react-v0-4-0	215.14 KB (🟢 -45 B)	306.41 KB
/blog/2013/07/23/community-roundup-5	216.03 KB (🟢 -45 B)	307.29 KB
/blog/2013/07/26/react-v0-4-1	213.91 KB (🟢 -44 B)	305.17 KB
/blog/2013/07/30/use-react-and-jsx-in-ruby-on-rails	214.51 KB (🟢 -44 B)	305.77 KB
/blog/2013/08/05/community-roundup-6	215.32 KB (🟢 -48 B)	306.58 KB
/blog/2013/08/19/use-react-and-jsx-in-python-applications	214.52 KB (🟢 -45 B)	305.79 KB
/blog/2013/08/26/community-roundup-7	215.49 KB (🟢 -46 B)	306.75 KB
/blog/2013/09/24/community-roundup-8	216.92 KB (🟢 -47 B)	308.18 KB
/blog/2013/10/03/community-roundup-9	215.86 KB (🟢 -50 B)	307.12 KB
/blog/2013/10/16/react-v0.5.0	215.54 KB (🟢 -48 B)	306.8 KB
/blog/2013/10/29/react-v0-5-1	213.9 KB (🟢 -47 B)	305.16 KB
/blog/2013/11/06/community-roundup-10	217.52 KB (🟢 -49 B)	308.78 KB
/blog/2013/11/18/community-roundup-11	216.6 KB (🟢 -46 B)	307.86 KB
/blog/2013/12/18/react-v0.5.2-v0.4.2	214.37 KB (🟢 -46 B)	305.63 KB
/blog/2013/12/19/react-v0.8.0	214.79 KB (🟢 -44 B)	306.05 KB
/blog/2013/12/23/community-roundup-12	216.25 KB (🟢 -46 B)	307.51 KB
/blog/2013/12/30/community-roundup-13	216.03 KB (🟢 -48 B)	307.3 KB
/blog/2014/01/02/react-chrome-developer-tools	214.29 KB (🟢 -45 B)	305.55 KB
/blog/2014/01/06/community-roundup-14	215.63 KB (🟢 -45 B)	306.89 KB
/blog/2014/02/05/community-roundup-15	216.84 KB (🟢 -44 B)	308.11 KB
/blog/2014/02/15/community-roundup-16	216.56 KB (🟢 -48 B)	307.82 KB
/blog/2014/02/16/react-v0.9-rc1	216.96 KB (🟢 -47 B)	308.22 KB
/blog/2014/02/20/react-v0.9	217.41 KB (🟢 -50 B)	308.67 KB
/blog/2014/02/24/community-roundup-17	216.27 KB (🟢 -49 B)	307.53 KB
/blog/2014/03/14/community-roundup-18	217.24 KB (🟢 -44 B)	308.5 KB
/blog/2014/03/19/react-v0.10-rc1	215.54 KB (🟢 -48 B)	306.81 KB
/blog/2014/03/21/react-v0.10	215.57 KB (🟢 -47 B)	306.83 KB
/blog/2014/03/28/the-road-to-1.0	215.68 KB (🟢 -48 B)	306.94 KB
/blog/2014/04/04/reactnet	214.32 KB (🟢 -47 B)	305.58 KB
/blog/2014/05/06/flux	214.45 KB (🟢 -43 B)	305.71 KB
/blog/2014/05/29/one-year-of-open-source-react	214.67 KB (🟢 -44 B)	305.93 KB
/blog/2014/06/27/community-roundup-19	216.21 KB (🟢 -51 B)	307.48 KB
/blog/2014/07/13/react-v0.11-rc1	216.6 KB (🟢 -46 B)	307.86 KB
/blog/2014/07/17/react-v0.11	217.86 KB (🟢 -49 B)	309.12 KB
/blog/2014/07/25/react-v0.11.1	214.81 KB (🟢 -46 B)	306.07 KB
/blog/2014/07/28/community-roundup-20	216.36 KB (🟢 -48 B)	307.62 KB
/blog/2014/07/30/flux-actions-and-the-dispatcher	215.99 KB (🟢 -45 B)	307.25 KB
/blog/2014/08/03/community-roundup-21	216.03 KB (🟢 -48 B)	307.29 KB
/blog/2014/09/03/introducing-the-jsx-specification	214.03 KB (🟢 -44 B)	305.29 KB
/blog/2014/09/12/community-round-up-22	216.51 KB (🟢 -44 B)	307.77 KB
/blog/2014/09/16/react-v0.11.2	214.8 KB (🟢 -45 B)	306.06 KB
/blog/2014/09/24/testing-flux-applications	217.98 KB (🟢 -48 B)	309.24 KB
/blog/2014/10/14/introducing-react-elements	216.94 KB (🟢 -48 B)	308.2 KB
/blog/2014/10/16/react-v0.12-rc1	216.9 KB (🟢 -49 B)	308.16 KB
/blog/2014/10/17/community-roundup-23	217.47 KB (🟢 -46 B)	308.74 KB
/blog/2014/10/27/react-js-conf	214.08 KB (🟢 -45 B)	305.34 KB
/blog/2014/10/28/react-v0.12	216.85 KB (🟢 -42 B)	308.11 KB
/blog/2014/11/24/react-js-conf-updates	214.46 KB (🟢 -44 B)	305.72 KB
/blog/2014/11/25/community-roundup-24	217.7 KB (🟢 -51 B)	308.96 KB
/blog/2014/12/18/react-v0.12.2	214.49 KB (🟢 -44 B)	305.75 KB
/blog/2014/12/19/react-js-conf-diversity-scholarship	214.88 KB (🟢 -45 B)	306.15 KB
/blog/2015/01/27/react-v0.13.0-beta-1	215.85 KB (🟢 -50 B)	307.11 KB
/blog/2015/02/18/react-conf-roundup-2015	217.84 KB (🟢 -46 B)	309.1 KB
/blog/2015/02/20/introducing-relay-and-graphql	216.99 KB (🟢 -45 B)	308.25 KB
/blog/2015/02/24/react-v0.13-rc1	215.89 KB (🟢 -48 B)	307.16 KB
/blog/2015/02/24/streamlining-react-elements	218.44 KB (🟢 -51 B)	309.71 KB
/blog/2015/03/03/react-v0.13-rc2	215.23 KB (🟢 -47 B)	306.49 KB
/blog/2015/03/04/community-roundup-25	216.19 KB (🟢 -49 B)	307.45 KB
/blog/2015/03/10/react-v0.13	216.51 KB (🟢 -47 B)	307.77 KB
/blog/2015/03/16/react-v0.13.1	214.33 KB (🟢 -44 B)	305.59 KB
/blog/2015/03/19/building-the-facebook-news-feed-with-relay	217.08 KB (🟢 -46 B)	308.34 KB
/blog/2015/03/26/introducing-react-native	214.22 KB (🟢 -46 B)	305.48 KB
/blog/2015/03/30/community-roundup-26	216.15 KB (🟢 -50 B)	307.42 KB
/blog/2015/04/17/react-native-v0.4	215.07 KB (🟢 -45 B)	306.33 KB
/blog/2015/04/18/react-v0.13.2	214.4 KB (🟢 -47 B)	305.66 KB
/blog/2015/05/01/graphql-introduction	218.89 KB (🟢 -47 B)	310.15 KB
/blog/2015/05/08/react-v0.13.3	214.29 KB (🟢 -43 B)	305.55 KB
/blog/2015/05/22/react-native-release-process	214.44 KB (🟢 -45 B)	305.71 KB
/blog/2015/06/12/deprecating-jstransform-and-react-tools	214.9 KB (🟢 -46 B)	306.16 KB
/blog/2015/07/03/react-v0.14-beta-1	216.41 KB (🟢 -47 B)	307.67 KB
/blog/2015/08/03/new-react-devtools-beta	215.01 KB (🟢 -48 B)	306.27 KB
/blog/2015/08/11/relay-technical-preview	215.07 KB (🟢 -44 B)	306.33 KB
/blog/2015/08/13/reacteurope-roundup	216.66 KB (🟢 -45 B)	307.92 KB
/blog/2015/09/02/new-react-developer-tools	214.43 KB (🟢 -45 B)	305.69 KB
/blog/2015/09/10/react-v0.14-rc1	220.06 KB (🟢 -99 B)	311.32 KB
/blog/2015/09/14/community-roundup-27	216.58 KB (🟢 -47 B)	307.85 KB
/blog/2015/10/01/react-render-and-top-level-api	215.55 KB (🟢 -46 B)	306.82 KB
/blog/2015/10/07/react-v0.14	220.54 KB (🟢 -105 B)	311.8 KB
/blog/2015/10/19/reactiflux-is-moving-to-discord	216.31 KB (🟢 -43 B)	307.57 KB
/blog/2015/10/28/react-v0.14.1	214.32 KB (🟢 -45 B)	305.58 KB
/blog/2015/11/02/react-v0.14.2	214.35 KB (🟢 -45 B)	305.61 KB
/blog/2015/11/18/react-v0.14.3	214.47 KB (🟢 -44 B)	305.73 KB
/blog/2015/12/04/react-js-conf-2016-diversity-scholarship	215.34 KB (🟢 -43 B)	306.6 KB
/blog/2015/12/16/ismounted-antipattern	214.94 KB (🟢 -44 B)	306.2 KB
/blog/2015/12/18/react-components-elements-and-instances	218.87 KB (🟢 -47 B)	310.13 KB
/blog/2015/12/29/react-v0.14.4	214.14 KB (🟢 -46 B)	305.4 KB
/blog/2016/01/08/A-implies-B-does-not-imply-B-implies-A	215.16 KB (🟢 -46 B)	306.42 KB
/blog/2016/01/12/discontinuing-ie8-support	213.96 KB (🟢 -45 B)	305.23 KB
/blog/2016/02/19/new-versioning-scheme	215.34 KB (🟢 -46 B)	306.61 KB
/blog/2016/03/07/react-v15-rc1	218.04 KB (🟢 -107 B)	309.3 KB
/blog/2016/03/16/react-v15-rc2	214.96 KB (🟢 -46 B)	306.22 KB
/blog/2016/03/29/react-v0.14.8	214.09 KB (🟢 -46 B)	305.35 KB
/blog/2016/04/07/react-v15	222.16 KB (🟢 -186 B)	313.42 KB
/blog/2016/04/08/react-v15.0.1	214.85 KB (🟢 -44 B)	306.11 KB
/blog/2016/07/11/introducing-reacts-error-code-system	214.56 KB (🟢 -45 B)	305.82 KB
/blog/2016/07/13/mixins-considered-harmful	222.72 KB (🟢 -50 B)	313.98 KB
/blog/2016/07/22/create-apps-with-no-configuration	218.04 KB (🟢 -52 B)	309.31 KB
/blog/2016/08/05/relay-state-of-the-state	218.08 KB (🟢 -48 B)	309.35 KB
/blog/2016/09/28/our-first-50000-stars	219.53 KB (🟢 -49 B)	310.79 KB
/blog/2016/11/16/react-v15.4.0	217.48 KB (🟢 -50 B)	308.74 KB
/blog/2017/04/07/react-v15.5.0	218.04 KB (🟢 -50 B)	309.31 KB
/blog/2017/05/18/whats-new-in-create-react-app	217.44 KB (🟢 -58 B)	308.71 KB
/blog/2017/06/13/react-v15.6.0	216.07 KB (🟢 -47 B)	307.33 KB
/blog/2017/07/26/error-handling-in-react-16	216.41 KB (🟢 -47 B)	307.67 KB
/blog/2017/09/08/dom-attributes-in-react-16	216.85 KB (🟢 -50 B)	308.11 KB
/blog/2017/09/25/react-v15.6.2	215.18 KB (🟢 -48 B)	306.44 KB
/blog/2017/09/26/react-v16.0	220.31 KB (🟢 -49 B)	311.57 KB
/blog/2017/11/28/react-v16.2.0-fragment-support	218.22 KB (🟢 -54 B)	309.48 KB
/blog/2017/12/07/introducing-the-react-rfc-process	214.76 KB (🟢 -45 B)	306.03 KB
/blog/2017/12/15/improving-the-repository-infrastructure	230.55 KB (🟢 -56 B)	321.81 KB
/blog/2018/03/01/sneak-peek-beyond-react-16	214.72 KB (🟢 -45 B)	305.98 KB
/blog/2018/03/27/update-on-async-rendering	219.96 KB (🟢 -48 B)	311.22 KB
/blog/2018/03/29/react-v-16-3	216.78 KB (🟢 -42 B)	308.05 KB
/blog/2018/05/23/react-v-16-4	216.92 KB (🟢 -46 B)	308.18 KB
/blog/2018/06/07/you-probably-dont-need-derived-state	220.58 KB (🟢 -49 B)	311.84 KB
/blog/2018/08/01/react-v-16-4-2	215.57 KB (🟢 -50 B)	306.83 KB
/blog/2018/09/10/introducing-the-react-profiler	217.18 KB (🟢 -55 B)	308.44 KB
/blog/2018/10/01/create-react-app-v2	217.66 KB (🟢 -45 B)	308.92 KB
/blog/2018/10/23/react-v-16-6	216.86 KB (🟢 -46 B)	308.12 KB
/blog/2018/11/13/react-conf-recap	214.57 KB (🟢 -46 B)	305.83 KB
/blog/2018/11/27/react-16-roadmap	220.76 KB (🟢 -51 B)	312.03 KB
/blog/2018/12/19/react-v-16-7	215.69 KB (🟢 -46 B)	306.96 KB
/blog/2019/02/06/react-v16.8.0	217.96 KB (🟢 -47 B)	309.22 KB
/blog/2019/02/23/is-react-translated-yet	217.53 KB (🟢 -48 B)	308.79 KB
/blog/2019/08/08/react-v16.9.0	220.46 KB (🟢 -51 B)	311.72 KB
/blog/2019/08/15/new-react-devtools	215.06 KB (🟢 -48 B)	306.32 KB
/blog/2019/10/22/react-release-channels	216.87 KB (🟢 -46 B)	308.13 KB
/blog/2019/11/06/building-great-user-experiences-with-concurrent-mode-and-suspense	221.58 KB (🟢 -42 B)	312.84 KB
/blog/2020/02/26/react-v16.13.0	217.8 KB (🟢 -49 B)	309.06 KB
/blog/2020/08/10/react-v17-rc	224.08 KB (🟢 -51 B)	315.34 KB
/blog/all	53.44 KB (🟢 -589 B)	144.7 KB
/community	203.59 KB (🟡 +766 B)	294.85 KB
/community/acknowledgements	204.55 KB (🟡 +532 B)	295.81 KB
/community/meet-the-team	205.08 KB (🟡 +530 B)	296.34 KB
/learn	212.07 KB (🟡 +542 B)	303.33 KB
/learn/add-react-to-a-website	208.19 KB (🟡 +540 B)	299.45 KB
/learn/adding-interactivity	209.99 KB (🟡 +540 B)	301.25 KB
/learn/choosing-the-state-structure	215.73 KB (🟡 +538 B)	306.99 KB
/learn/conditional-rendering	207.96 KB (🟡 +543 B)	299.23 KB
/learn/describing-the-ui	207.17 KB (🟡 +541 B)	298.44 KB
/learn/editor-setup	204.45 KB (🟡 +540 B)	295.71 KB
/learn/escape-hatches	202.69 KB (🟡 +540 B)	293.95 KB
/learn/extracting-state-logic-into-a-reducer	213.33 KB (🟡 +541 B)	304.6 KB
/learn/importing-and-exporting-components	206.36 KB (🟡 +540 B)	297.63 KB
/learn/installation	204.01 KB (🟡 +540 B)	295.27 KB
/learn/javascript-in-jsx-with-curly-braces	206.44 KB (🟡 +540 B)	297.7 KB
/learn/keeping-components-pure	210.57 KB (🟡 +540 B)	301.83 KB
/learn/managing-state	209.29 KB (🟡 +540 B)	300.55 KB
/learn/manipulating-the-dom-with-refs	211.2 KB (🟡 +540 B)	302.47 KB
/learn/passing-data-deeply-with-context	210.72 KB (🟡 +540 B)	301.98 KB
/learn/passing-props-to-a-component	210.14 KB (🟡 +540 B)	301.4 KB
/learn/preserving-and-resetting-state	212.96 KB (🟡 +540 B)	304.22 KB
/learn/queueing-a-series-of-state-updates	207.93 KB (🟡 +540 B)	299.2 KB
/learn/react-developer-tools	203.89 KB (🟡 +540 B)	295.15 KB
/learn/reacting-to-input-with-state	212.41 KB (🟡 +548 B)	303.67 KB
/learn/referencing-values-with-refs	209.45 KB (🟡 +538 B)	300.71 KB
/learn/render-and-commit	206.42 KB (🟡 +540 B)	297.69 KB
/learn/rendering-lists	210.49 KB (🟡 +539 B)	301.75 KB
/learn/responding-to-events	209.49 KB (🟡 +538 B)	300.75 KB
/learn/scaling-up-with-reducer-and-context	207.51 KB (🟡 +540 B)	298.77 KB
/learn/sharing-state-between-components	208.22 KB (🟡 +540 B)	299.48 KB
/learn/start-a-new-react-project	204.86 KB (🟡 +540 B)	296.12 KB
/learn/state-a-components-memory	213.66 KB (🟡 +539 B)	304.92 KB
/learn/state-as-a-snapshot	207.48 KB (🟡 +540 B)	298.74 KB
/learn/thinking-in-react	209.37 KB (🟡 +540 B)	300.63 KB
/learn/updating-arrays-in-state	211.55 KB (🟡 +537 B)	302.82 KB
/learn/updating-objects-in-state	211.27 KB (🟡 +540 B)	302.53 KB
/learn/writing-markup-with-jsx	206.36 KB (🟡 +540 B)	297.63 KB
/learn/your-first-component	207.26 KB (🟡 +540 B)	298.52 KB
/reference	203.32 KB (🟡 +527 B)	294.58 KB
/reference/reactdom	203.47 KB (🟡 +532 B)	294.73 KB
/reference/render	204.81 KB (🟡 +533 B)	296.07 KB
/reference/usestate	211.29 KB (🟡 +533 B)	302.55 KB

Details

Only the gzipped size is provided here based on an expert tip.

First Load is the size of the global bundle plus the bundle for the individual page. If a user were to show up to your website and land on a given page, the first load size represents the amount of javascript that user would need to download. If next/link is used, subsequent page loads would only need to download that page's bundle (the number in the "Size" column), since the global bundle has already been downloaded.

Any third party scripts you have added directly to your app using the <script> tag are not accounted for in this analysis

Next to the size is how much the size has increased or decreased compared with the base branch of this PR. If this percentage has increased by 10% or more, there will be a red status indicator applied, indicating that special attention should be given to this.

[gaearon]

So does lint task run on CI and fail it if lint fails? Did it do that before this PR? I thought it did..

[harish-sethuraman]

I haven't added the git workflow yet. I added to pre commit hook. So when someone tries to commit we try to fix auto fixable issues and then show error if any.

[gaearon]

Doesn’t the existing Build / Lint action do this?

[harish-sethuraman]

Nope it wasn't happening before.

The already present lint didn't report any error. When I added and extended the next configuration many errors surfaced.

[gaearon]

Ah, the action does this for the old site.

[gaearon]

nit: i: number, not i :number. why didn't Prettier catch this?

[harish-sethuraman]

🤔 Not sure how this was missed.

[harish-sethuraman]

Changed

[gaearon]

Yea but can we figure out why Prettier didn't fail CI if it mismatched.

[gaearon]

Maybe Prettier only runs ci for non-beta code? Then let's fix that.

[harish-sethuraman]

It seems like we have the prettier command but haven't run it 🤔 . Should we add the same to pre commit as well ?

[gaearon]

Yes. Also it should fail CI if it doesn't pass. See ci-check task in package.json. We need to run this on CI if it doesn't already.

[harish-sethuraman]

So we already have a workflow for checking in the legacy site. Shall I add the ci-check to run there itself for the beta directory too ? Or shall I add a seperate workflow for it ?

[harish-sethuraman]

#4100 @gaearon Since there were lot of file changes as prettier ran, I've actually raised a seperate PR for that.Now we will run prettier before commits and have a workflow to check if any code is not prettified.