Code Quality Front

This project contains a collection of essential quality tools for front applications, including Prettier, TypeScript configuration, Jest, and ESLint.

Table of Contents

1. Introduction
2. Installation
3. Usage
4. Configuration
5. Contributing
6. License

Introduction

Code Quality Front Tools aims to help you maintain a high-quality codebase by providing a set of tools and configurations for code formatting, type checking, testing, and linting. The included tools are:

• Prettier: An opinionated code formatter.
• TypeScript: A superset of JavaScript that adds static types.
• Jest: A delightful JavaScript testing framework.
• ESLint: A pluggable JavaScript linter.

Code Quality include all quality packages you need for your font project. Make sure you have installed all these dependencies before using the tools.

Check package.json for more details.

Installation of the package

• Make sure you have installed all these dependencies before using the tools.
• To install the Code Quality Front Tools in your project, run the following command :

npm install @groupeactual/code-quality-front

Copy makefile rule and use these commands to init your project depending on your framework :

make init-quality-react

or

make init-quality-react-native

You can customize these configurations (Prettier/TypeScript/Jest/ESLint) to fit your project's needs, all these configurations can be overridden in your project.

Configuration

Each tool comes with its own configuration file:

• Prettier: .prettierrc.cjs
• TypeScript: tsconfig.json
• Jest: jest.config.cjs
• ESLint: .eslintrc.cjs

Configuring import orders

This package comes with prettier-plugin-sort-imports

Your .prettierrc.js can be configured to look like this

const config = require('@groupeactual/code-quality-front/react-prettier');

module.exports = {
  ...config,
  rules: {
    ...config?.rules
  },
  importOrder: [
    '^(react|react-native)$',
    '<THIRD_PARTY_MODULES>',
    '^@(alias1|alias2)/.*',
    '^[./]'
  ],
  importOrderSeparation: true,
  importOrderSortSpecifiers: true
};

CI

For each new tag created, a new release will be created on github and a new version will be published on npm.

Contributing

You are invited to follow our guide for contributing.

License

© Actual Digital