@axa-ch/easy-config
v2.1.1
Published
Modern and strict configuration files to build consistently web applications.
Downloads
449
Readme
easy-config
Modern and strict configuration files to build consistently web applications.
Table of content
Getting started
Installation
Start by installing BiomeJS, Prettier and @axa-ch/easy-config
.
npm i -D --save-exact @biomejs/biome @axa-ch/easy-config prettier
Configuration
Create a biome.json
file at the root of your project
{
"$schema": "https://biomejs.dev/schemas/1.8.3/schema.json",
"extends": ["./node_modules/@axa-ch/easy-config/biome/base.json"]
}
You can configure this to your liking. Follow the Configuration guide from biome.
To configure prettier, add a .prettierrc.js
file with the following content:
import { prettier } from '@axa-ch/easy-config';
export default prettier.base;
Why not use biome format
?
Biomes formatting support is currently not developed enough for us to make the full move over to biome. For instance, Biome currently doesn't support CSS Formatting or Markdown. Furthermore, Biome doesn't plan to support SCSS in the foreseeing future, so it makes sense to stick to prettier.
IDE Integration
Biome provides plugins for the most common IDEs:
IntelliJ
When using IntelliJ, Biome and Prettier conflict when trying to run Ctrl+Alt+
Shift+P. This is because Biome is set to run biome check
when pressing this shortcut, Prettier is set
up to format when this shortcut is used.
To avoid this conflict we would recommend Setting the prettier configuration to manual and then checking
the Run on 'Reformat Code' action
. This way, you can press
Ctrl+Alt+L to run Prettier. Alternatively, you can remap either of those commands to
different keystrokes.
Typescript setup
Start by installing typescript:
npm i -D --save-exact typescript
Then, create a tsconfig.json
file and extend @axa-ch/easy-config
:
{
"extends": ["@axa-ch/easy-config/ts-config/base"]
}
Stylelint setup
Start by installing stylelint and the rules used by easy-config:
npm i -D --save-exact stylelint stylelint-config-standard
Extend easy-config in the .stylelintrc.js
file:
import { stylelint } from '@axa-ch/easy-config';
/** @type {import('stylelint').Config} */
export default {
extends: [stylelint.base],
};
SCSS Setup
To use Stylelint with SASS, start by installing the SCSS default config for stylelint:
npm i -D --save-exact stylelint-config-standard-scss
Extend your stylelint configuration like shown below:
import { stylelint } from '@axa-ch/easy-config';
/** @type {import('stylelint').Config} */
export default {
extends: [stylelint.base, stylelint.scss],
};
CSS Order Setup
You can install this extension if you want to ensure that CSS Properties are defined in a consistent way.
Start by installing the extension:
npm i -D --save-exact stylelint-order
Extend your stylelint configuration like shown below:
import { stylelint } from '@axa-ch/easy-config';
/** @type {import('stylelint').Config} */
export default {
extends: [stylelint.base, stylelint.order],
};