gem-hunter
Language: TypeScript
Automatically add directives based on glob matching
Automatically add directives based on glob matching.
When you need to include certain directives in your Rollup bundle (e.g., building a React package that contains "use client" or "use server" to support React Server Components), Rollup will warn you and remove these directives from the bundle output. This plugin solves the issue by automatically adding the directives, based on glob matching, to the output code during the bundling process.
npm install -D rollup-plugin-add-directive
import { addDirective } from 'rollup-plugin-add-directive'; export default { plugins: [ // Adds 'use client' to every file if no option is provided addDirective() // other rollup plugins ... ] };
import { addDirective } from 'rollup-plugin-add-directive'; export default { plugins: [ // Adds 'use client' to files in the components folder addDirective({ pattern: '**/components/*', directive: "'use client';" }), // Adds 'use server' to files in the api folder addDirective({ pattern: '**/api/*', directive: "'use server';" }) // other rollup plugins ... ] };
This plugin uses micromatch for glob matching under the hood and exposes its options parameter as-is, allowing you to use all the options provided by micromatch.
import { addDirective } from 'rollup-plugin-add-directive'; export default { plugins: [ // Adds 'use client' to every file whose name starts with 'use' (e.g., React hooks) addDirective({ pattern: 'use*', options: { basename: true }, directive: "'use client';" }) // other rollup plugins ... ] };