├── .DS_Store
├── README.md
└── images
├── facebook.svg
├── github.svg
├── linkedin.svg
├── website.svg
└── youtube.svg
/.DS_Store:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/anisul-Islam/eslint-documentation/f2445fdba643edf53f3a07d8a247772a8f5bac42/.DS_Store
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | 👋 Hello, I'm Anisul Islam
2 |
3 | A full time content creator on & web developer
4 |
5 |
6 |
7 | [
][website]
8 | [
][youtube]
9 | [
][facebook]
10 | [
][linkedin]
11 |
12 |
13 |
14 |
15 |
16 |
17 | # ESLint
18 |
19 | ### 1. What is ESLint?
20 |
21 | - A linter - tool for identifying and reporting programmatic, stylistic errors.
22 | - ESLint does static error checking before running the program
23 |
24 | ### 2. Example of Popular Linters
25 |
26 | - [JSLint](https://www.jslint.com/)
27 | - [ESLint](https://eslint.org/)
28 | - [JSHint](https://jshint.com/)
29 |
30 | ### 3. Prerequisities for setting up ESLint
31 |
32 | - install Node.js
33 | - install VSCode (as we will use VSCode)
34 |
35 | ### 4. Installing & using ESLint
36 |
37 | 1. Create package.json: `npm init`
38 | 2. Install and configure eslint as dev dependency: `npm init @eslint/config`
39 | 3. Initialize eslint: `eslint --init` and follow steps:
40 |
41 | - How would you like to use ESLint? To check syntax and find problems
42 | - How would you like to use ESLint? None of these
43 | - How would you like to use ESLint? None of these
44 | - Does your project use TypeScript? › No
45 | - Where does your code run? Browser
46 |
47 | 4. Go to `.eslintrc.json` file and make add your necessary adjustments
48 | Example
49 |
50 | ```json
51 |
52 | following codes will activate the recommended rules which can be changed inside the rules object.
53 | {
54 | "extends": "eslint:recommended"
55 | }
56 |
57 |
58 | Example of ESLint rules
59 | "rules": {
60 | "quotes": ["error", "double"]
61 | }
62 |
63 | More Examples of ESLint rules
64 | "rules": {
65 | "no-var": "error",
66 | "eqeqeq": "error",
67 | "no-unused-vars": "error",
68 | "default-case": "error",
69 | "no-console": "error",
70 | "camelcase": "error",
71 | "consistent-return": "error",
72 | "func-style": "error",
73 | "max-depth": ["error", 2],
74 | "max-lines": ["error", 25],
75 | "prefer-arrow-callback": "error",
76 | "prefer-const": "error",
77 | "no-useless-return": "error",
78 | "no-plusplus": "error",
79 | "quotes": ["error", "single"]
80 | }
81 |
82 | ```
83 |
84 | 5. add some codes in a js file for testing the eslint. I have created a file called app.js and added the following codes for testing purpose
85 |
86 | ```javascript
87 | var username = "anisul Islam";
88 | var password = "12345";
89 | var occupation = "full stack web developer";
90 | const user_presentaddress = "lala";
91 |
92 | var a = 6;
93 | a++;
94 |
95 | console.log(occupation);
96 |
97 | const validateUser = (pwd) => {
98 | if (password == pwd) {
99 | return true;
100 | }
101 | };
102 |
103 | console.log(validateUser(12345));
104 |
105 | switch (foo) {
106 | case 1:
107 | console.log(foo);
108 | break;
109 |
110 | case 2:
111 | console.log(foo);
112 | break;
113 | }
114 |
115 | const foo = true;
116 | if (foo) {
117 | if (foo) {
118 | if (foo) {
119 | console.log("hi");
120 | }
121 | console.log("hi");
122 | }
123 | console.log("hi");
124 | }
125 |
126 | setTimeout(function () {}, 1000);
127 | ```
128 |
129 | 6. make some changes in setting.json
130 |
131 | format on save and validate js codes: add the following codes in settings.json
132 |
133 | ```
134 | "editor.codeActionsOnSave": {
135 | "source.fixAll.eslint": true
136 | },
137 | "eslint.validate": ["javascript"]
138 | ```
139 |
140 | 7. Run the eslint: `eslint fileName.js` and check the erros
141 | 8. Fix automatically fixable errors: `eslint fileName.js --fix`
142 |
143 | ---
144 |
145 | ### Thanks for reading this documentation. keep following me.
146 |
147 | ---
148 |
149 |
150 |
151 | [website]: http://www.studywithanis.com/
152 | [youtube]: https://www.youtube.com/c/anisulislamrubel
153 | [facebook]: https://www.facebook.com/studywithanis/
154 | [linkedin]: https://www.linkedin.com/in/anisul2020/
155 | [github]: https://github.com/anisul-Islam
156 |
--------------------------------------------------------------------------------
/images/facebook.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/images/github.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/images/linkedin.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/images/website.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/images/youtube.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------