Chef for Bitrix
Chef
CLI for building, testing, linting and diagnosing Bitrix JS extensions with TypeScript support
Install
npm install -g @bitrix/chefThen run chef init build in the project root
This is third-party code. Review the repository files before installing.
What it does
Chef bundles Bitrix JS extensions with Rollup, Babel and PostCSS, type-checks TypeScript and runs ESLint. Unit tests with Mocha and Chai run in real browsers via Playwright, and E2E tests are supported too. chef create scaffolds a new extension, chef flow-to-ts migrates Flow code to TypeScript, and chef diag reports dependencies, bundle sizes, cycles and unused extensions.
Who it is for. Frontend developers writing JS extensions for Bitrix and Bitrix24.
Good fit when
- You create a new extension in local/js and want a ready structure
- You migrate legacy extensions from Flow to TypeScript
- You need to run extension tests in a browser from CI
- You look for the cause of a bloated bundle or circular dependencies
Not a fit when
- The project is not built on Bitrix
- You need to change the PHP part of a module: Chef handles only JS and CSS
Example request
Create a vendor.orders extension with chef, set up bundle.config.ts for TypeScript and build itLimitations
Requires Node.js 22+ and a Bitrix project or module source directory. Tests need a local Bitrix installation, credentials in .env.test and Playwright browsers.
How to disable. Remove the package with npm uninstall -g @bitrix/chef and the VCS hooks if you installed them with chef init hooks.
Security check
- Runs builds and browser tests
- Stores a Bitrix login and password in .env.test for tests
- chef init hooks installs VCS hooks
README in short
Chef is a CLI for building, testing and maintaining Bitrix JS extensions. It covers TypeScript builds, Playwright tests, linting, scaffolding, Flow migration and diagnostics. The README documents bundle.config.ts options, the project-level chef.config.ts, browserslist handling and test environment setup. Documentation is available in Russian and English.
FAQ
Where does Chef get target browsers?
First from targets in bundle.config.ts, then from .browserslistrc, and otherwise it uses baseline widely available.
Can I set rules for all extensions?
Yes, with chef.config.ts in the project root using the deny, defaults and enforce sections.
Related
A frontend design skill with 23 commands, live browser iteration and 61 detector rules for common AI-generated UI tells
Vercel Agent Skills
Agent Skills
Vercel's skills: React and Next.js performance, UI guideline audits, React Native, component composition and deploys
A skill with a searchable base of styles, palettes, font pairings and UX rules that generates a design system per product type
An open-source Claude Design alternative that builds prototypes, decks, dashboards and video through your local agents