A simple plugin that allows you to include or exclude code blocks based on compile-time conditions. Same as #if, #else, #elif , #endif in C/C++, it looks like this:
// #if DEBUG
console.log('user', userData); // when DEBUG is false, this line will be removed
// #endifNote: You should modify the plugin options to ensure NOT to strip comments so quickly, since we work with them. For example, with
@rollup/plugin-typescript, setremoveComments: false.
More Rollup Plugins you might be interested in:
- rollup-plugin-conditional-compilation: Use directives like
// #if,// #elseto do the conditional compilation like C++. - rollup-plugin-const-enum: inline your
const enum XXX { ... }definitions at compile time. - rollup-plugin-func-macro: replace
__func__by function name of current block, and__file__by file name at compile time. For more awesome packages, check out my homepage💛
- Added configurable
ecmaVersionandsourceTypeoptions to pass to Acorn. Previously,sourceTypeis fixed in this plugin and prevented parsing ES module files; this is now configurable. - Fixed an issue where
variableswas required;variablesis now optional.
npm install --save-dev rollup-plugin-conditional-compilation
pnpm add -D rollup-plugin-conditional-compilationimport conditional from 'rollup-plugin-conditional-compilation';
export default {
...other configs,
plugins: [
// Recommended: run `conditional` before the TypeScript transformer so the
// plugin operates on the original source comments.
conditional({ variables: { DEBUG: false, FEATURE_X: true } }),
typescript({
...,
removeComments: false, // !!IMPORTANT!! Don't strip comments so quickly!
}),
],
};- Single-line directives only:
// #if <expression>,// #else,// #elif <expression>and// #endif. - The
<expression>is evaluated at build time with the keys fromvariablesavailable as identifiers.- You can write literally ANY JavaScript expressions in it, because it is evaluated as an IIFE (Immediately Invoked Function Expression).
- Supported directives:
#if,#else,#elif,#endif(similar to C/C++ style conditional compilation).
- Since it is
if/else, it follows the syntax ofif/elsestatements
Remove testing methods in your class when compiling for production:
class User {
private name: string;
private identifier: string;
// #if DEBUG
// This method will be removed in production build
_getTestData() {
return SomeImportantDataForTesting;
}
// #endif
}If variables.DEBUG === false, compiled output becomes:
console.log('always');-
AST Parsing: Using Acorn with
{ ecmaVersion: "latest", sourceType: "module" }by default to parse the code, so it supports the latest JavaScript syntax and ES modules. -
Directive Style: Only
//comments are scanned for directives; block comments (/* ... */) are ignored.- Reason 1: block comments can span multiple lines with
*ahead and may contain nested comments, making parsing more complex and error-prone. - Reason 2: For consistency and simplicity.
- Reason 1: block comments can span multiple lines with
-
Precise Evaluation: Expressions are executed using the Function constructor — do not pass untrusted input or rely on side effects.
MIT