Crafty is composed of small packages and can be used separately.
Here is an overview of their features.
Table of Contents
crafty
Command runner, this is the package that allows all other packages to run.
crafty --preset crafty-preset-babel jsLint presets/* --preset recommended --preset node
Also automatically reads your crafty.config.js (in the current working
directory) and loads those presets as well.
Runners
crafty-runner-webpack
Use this runner to bundle your code with Webpack.
crafty-runner-gulp
Use this runner to be able to create Gulp tasks in your projects.
Test runners
crafty-preset-jest
This preset will add Jest to the crafty test command.
Its usage with the Babel and TypeScript preset allows you to test your EcmaScript 2015+ and TypeScript code effortlessly.
Presets
crafty-preset-babel
This preset provides EcmaScript 2015+ support with Babel for Gulp, Webpack, and Jest.
This preset will include crafty-preset-eslint and provide ESLint with our linting rules.
crafty-preset-postcss
Compile your CSS using PostCSS, works with Webpack and Gulp.
crafty-preset-typescript
This preset provides TypeScript support for Gulp, Webpack, and Jest.
This preset will include crafty-preset-eslint and provide ESLint with our linting rules.
crafty-preset-images
This preset leverages Gulp to compress your SVG/PNG/JPG/GIF files and placing them in the destination folder.
crafty-preset-images-simple
In some cases, you might not have an internet connection on your build machine. As the tools to compress PNG/JPG/GIF need to be downloaded from GitHub, this preset will copy the files instead of copying them.
SVG is also compressed with this preset.
It works as a drop-in replacement for crafty-preset-images.
crafty-preset-maven
If your code is inside a Maven project, this preset overrides the destination to
move your compiled assets to the right directory in target
crafty-preset-react
A preset that provides utilities for Jest and Hot Module Replacement in React projects.
JSX Compilation is handled by the crafty-preset-babel already.
crafty-preset-prettier
Provides Prettier defaults for other presets
crafty-preset-eslint
Check your code with ESLint, this preset will provide a standalone jsLint command and configure Webpack.
Utilities from this package are leveraged to configure Gulp builds.
crafty-preset-swc
This preset provides EcmaScript 2015+ support with SWC for Gulp, Webpack, and Jest.
While SWC is able to compile TypeScript, this preset does not offer this feature at the moment.
It also configures ESLint with our linting rules. Both in the runners and as a separate command.
Utility packages
babel-preset-swissquote
A Babel preset that supports EcmaScript 2015+, React and more
eslint-plugin-swissquote
An ESLint plugin that contains all our recommended options and plugins.
postcss-swissquote-preset
All PostCSS plugins used in the Crafty styles preset are defined in this package.
stylelint-config-swissquote
Stylelint linting rules following the Swissquote CSS Guideline. Provides some custom Stylelint rules.