A place to keep all non-complex files, for DRY purposes. We have:
- Our logo in different versions.
- Our color palette.
- Linter configs.
For a npm
project, just add this line to your devDependencies
:
"kobo-common": "[email protected]:kobotoolbox/kobo-common.git#semver:1.2.3",
To pick a correct version, please remember that:
major
is not expected to change anytime soonminor
changes anytime an existing resource was modifiedpatch
changes anytime a new resource was added
Depending on your setup you might need to use HTTPS
url instead: https://github.com/kobotoolbox/kobo-common.git
.
For linter configs you need to extend the ones we have. You can simply create a file with one property:
// .eslintrc.js
module.exports = {
extends: './node_modules/kobo-common/src/configs/.eslintrc.js',
};
// .stylelintrc.js
module.exports = {
extends: './node_modules/kobo-common/src/configs/.stylelintrc.js',
};
// .prettierrc.js
module.exports = {
...require('./node_modules/kobo-common/src/configs/.prettierrc.js'),
};
For .editorconfig
unfortunately there is no easy way. You can either create a postinstall
script that would copy it to your repo root, or just copy&paste the content manually.
NOTE: you might need to install @typescript-eslint/parser
from peerDependencies
in your project to enable linting.
The color palette file requires a relative path to work, e.g. @use "../../node_modules/kobo-common/src/styles/colors";
, but to make it easier for you, try using these steps instead:
- Adding the package to
load-paths
like so:--load-path=node_modules/kobo-common/src/styles
- Referencing it in your file:
@use "colors";
- Using the variable:
color: colors.$kobo-blue;
We keep all usable stuff in src
directory.
We are relying on version tag heavily, so there are safety measures configured:
- A
pre-commit
hook will check (based on commited files) if version frompackage.json
file is correct - it compares the proposed version with the latest pushed tag. - A
post-commit
hook will add (and push) a version tag found inpackage.json
file.