I. Cài đặt thư viện
|
1 2 3 4 5 6 7 8 9 10 |
npm i -D prettier eslint // Thư viện để kết hợp prettier với eslint npm i -D eslint-config-prettier eslint-plugin-prettier // Thư viện để eslint nhận dạng typescript npm i -D @typescript-eslint/eslint-plugin @typescript-eslint/parser eslint-plugin-import // Thư viện để sử dụng cú pháp chuẩn của bnb npm i -D eslint-config-airbnb-typescript |
II. Config Prettier
- Tạo file config tại thư mục gốc: /.prettierrc.js hoặc: /prettier.config.js
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
module.exports = { useTabs: false, // sử dụng tab đầu dòng tabWidth: 4, // chiều rộng tab endOfLine: 'lf', semi: false, // dấu ; cuối dòng trailingComma: 'all', // điền dấu , ở item cuối cùng của object bracketSpacing: true, // khoảng trắng { a } thay vì {a} singleQuote: true, // dấu nháy '' thay vì "" printWidth: 100, // chiều dài 1 dòng: 120 arrowParens: 'avoid', // arrowfunction dạng: a => {} thay vì (a)=>{} htmlWhitespaceSensitivity: "ignore", // <a></a> không cho xuống dòng ngu ngu dạng <a></a \n > quoteProps: "as-needed", // Bỏ dấu ngoặc đơn ở key của Object } |
II. Config ESlint
1. Tạo file config tại thư mục gốc: /.eslintrc.js
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
module.exports = { root: true, parser: '@typescript-eslint/parser', extends: [ 'eslint:recommended', 'plugin:@typescript-eslint/recommended', 'airbnb-base', 'airbnb-typescript/base', 'prettier', ], plugins: ['@typescript-eslint', 'prettier'], parserOptions: { project: ['./tsconfig.json'], }, rules: { 'prettier/prettier': ['error'], 'no-unused-vars': 0, // khai báo biến mà không sử dụng sẽ lỗi '@typescript-eslint/no-unused-vars': 0, '@typescript-eslint/no-explicit-any': 0, // không cho dùng type any 'no-console': 0, 'no-useless-concat': 0, // Bắt buộc viết 1 chuỗi, ko để dạng cộng 2 chuỗi, vcc 'prefer-template': 0, // Bắt buộc dùng template string khi cộng chuỗi, vcc 'import/prefer-default-export': 0, // Nếu export 1 biến thì mặc định phải là default, vcc }, } |
2. Tạo file ignore tại thư mục gốc: /.eslintignore
|
1 2 |
node_modules dist |
