Beautify code to match standardized style guide #62
Comments
yunchae-kim
added a commit
that referenced
this issue
Aug 9, 2023
[#62] Refer to GitHub issue... This update does the followings to implement better coding style guide standard based on Airbnb Style Guide, ESLint, Prettier, and PEP8. .editorconfig - Added file to implement necessary format settings across different IDEs including VSCode. .eslintrc - Removed Typescript related extensions and plugins as it prompts ESLint unnecessary warnings. Will be implemented again once Typescript is used. - Import plugin added to lint import-related codes. - Several rules were included to overrule Prettier with Airbnb rules, which we figured were better coding practices. The followings are included: react/no-multi-comp semi, comma-dangle, no-underscore-dangle, space-before-blocks, keyword-spacing, spaced-comment, quotes, prefer-template, template-curly-spacing, jsx-quotes, camelcase, no-unused-vars. - Import rules were added to match with Airbnb style guide. - Rules are subject to change in the future and documentation regarding the changes will be written. .prettierrc - Some rules were changed to overrule Prettier with Airbnb rules. .vscode/settings.json - Editor indent setting was removed as it is now included in .editorconfig. package.json - Removed Typescript related extensions and will be implemented in the future once Typescript is used. - Airbnb related ESLint plugins were added to enforce Airbnb style guide rules. - StyleLint was added to organize CSS files. The tool is being tested and may be removed in the future.
|
Reopening issue to update modifications |
yunchae-kim
added a commit
that referenced
this issue
Aug 15, 2023
[#62] Refer to GitHub issue... This update makes the following changes to the style guide implementations package.json - added babel plugin to fix dependency issues. - added eslint-import-sort and simple-import-sort to sort React imports. - added postcss and postcss-sorting to sort css attributes. - added prettier-jinja-template to read jinja HTML files. - added prettier-organize-attributes to sort HTML attributes. - added stylelint-config-recess-order to lint css attribute orders according to Recess rule. .eslinrc - modified general settings such as root, and env for more accurate implementation. - added simple-import-sort and sort-exports to sort react import and exports. - modified react indent setting to 2 spaces. - modified several eslint rules to "warning" to avoid causing bugs in previously written codes. These warnings are to be fixed in the future if needed. - added import sorting rules based on grouping and then alphabetically sorting. - added exception rules for underscore-dangle to avoid conflicts with Rewire package. prettierrc - added plugin organize-attributes to sort HTML attributes on common convention. - added plugin jinja-template to allow prettier to modify Jinja files properly. - added exception rules for html files and yml files. stylelintrc - added file to modify rules for Stylelint. - added rule selector-class-pattern to avoid causing bugs in previously written codes. These warnings are to be fixed in the future if needed. - added rule font-family-name-quotes to ignore unnecessary font import rules. .vscode/extensions.json - added batisteo.vscode-django to allow formatting Jinja files by changing Jinja HTML to Django HTML. - added monosans.djlint to lint Jinja files. - added samuelcolvin.jinjahtml to read HTML files as Jinja HTML files. - added jota0222.multi-formatter to use multi-formatter, especially to apply prettier first and then django formatter to Jinja HTML files. - added redhat.vscode-yaml to format YAML files. .vscode/settings.json - modified to format html files with Django formatter and css files with postcss. - added css ordering rule to match with Stylelint Recess ordering format. web/package.json - style: edited indents. setup.py - added isort package to sort package imports.
yunchae-kim
added a commit
that referenced
this issue
Sep 27, 2023
[#62] Refer to GitHub issue… The purpose of this update is to fix VSCode setting in order to apply Python isort properly. isort will now be applied automatically on save, with its profile setting based on Black.
yunchae-kim
added a commit
that referenced
this issue
Sep 28, 2023
[#62] Refer to GitHub issue... This update addresses the ESLint conflicts between eslint-plugin-prettier and our ESLint rules. The conflicts caused issues with automatic double-quoting of JavaScript strings, overriding our preference for single quotes. We have decided to replace eslint-plugin-prettier with the prettier-eslint extension in VSCode for better ESLint and Prettier compatibility. Changes made in this update: - Removed eslint-plugin-prettier from package.json. - Removed eslint-plugin-sort-exports, as we now use eslint-plugin-simple-import-sort for sorting React exports. - Updated package-lock.json accordingly. - Added rvest.vs-code-prettier-eslint to .vscode/extensions.json for prettier-eslint compatibility. - Changed default formatters in .vscode/settings.json from esbenp.prettier-vscode (Prettier) to rvest.vs-code-prettier-eslint (Prettier ESLint). - Removed all eslint-plugin-prettier and eslint-plugin-sort-exports references from .eslintrc. - Turned off the import/order rule to avoid conflicts with simple-import-sort/imports.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Some of the codes are not formatted to the standardized format according to the style guides implemented in issue-#47.
The goal is to beautify all the codes currently in comptox_ai in order to
The formatting task should be a long term task done from time to time with low priority. It should be done by bundling files into relevant categories and fixing each bundle per commit (e.g. app components, python tests, python functions, react tests).
Communication between team members is essential in order to avoid merge conflicts and the bundles chosen to beautify should be codes that are not currently being worked on.
The text was updated successfully, but these errors were encountered: