Bundle Cypress specs using esbuild
npm i -D cypress @bahmutov/cypress-esbuild-preprocessor esbuild
# note: this plugin assumes the esbuild is peer dependency
In your plugin file use this module as the preprocessor
// cypress/plugins/index.js
const createBundler = require('@bahmutov/cypress-esbuild-preprocessor')
module.exports = (on, config) => {
on('file:preprocessor', createBundler())
}
If you want to pass your own ESBuild options
// cypress/plugins/index.js
const createBundler = require('@bahmutov/cypress-esbuild-preprocessor')
module.exports = (on, config) => {
const bundler = createBundler({
// any ESBuild options here
// https://esbuild.github.io/api/
})
on('file:preprocessor', bundler)
}
Run with the environment variable DEBUG=cypress-esbuild-preprocessor
But also if something is not working, check out the alternative package: cypress-esbuild-preprocessor
- instead of the file preprocessor, exposes a constructor function to allow user options to ESBuild
// v1
const bundler = require('cypress-esbuild-preprocessor')
module.exports = (on, config) => {
on('file:preprocessor', bundler)
}
// v2
const createBundler = require('cypress-esbuild-preprocessor')
module.exports = (on, config) => {
// pass ESBuild options to be applied to each spec file
const bundler = createBundler({
define: {
'process.env.NODE_ENV': '"development"',
},
})
on('file:preprocessor', bundler)
}
Author: Gleb Bahmutov <[email protected]> © 2022
- @bahmutov
- glebbahmutov.com
- blog
- videos
- presentations
- cypress.tips
- Cypress Tips & Tricks Newsletter
- my Cypress courses
License: MIT - do anything with the code, but don't blame me if it does not work.
Support: if you find any problems with this module, email / tweet / open issue on Github