gem-hunter
主要言語: JavaScript
🍣 A Rollup plugin to customize the content of the imported module - not just the text
🍣 A Rollup plugin to customize the content of the imported module - not just the text
Using npm:
npm install --save-dev rollup-plugin-custom-importCreate a rollup.config.js configuration file and import the plugin:
// rollup.config.js import { customImport } from 'rollup-plugin-custom-import'; export default { input: 'src/index.ts', output: { dir: 'output', format: 'cjs', }, plugins: [ customImport({ // see behind for config details include: [''], content: (id, originalContent) => { return `export default ${JSON.stringify(originalContent)};`; }, }), ], };
Then call rollup either via the CLI or the API.
Options interface is shown below:
interface Options { include: string[] | RegExp[] | ((path: string) => boolean); exclude?: string[] | RegExp[] | ((path: string) => boolean); content: FileContentSpecifier; } export type FileContentSpecifier = string | FileContentSetter; export type FileContentSetter = ( id: string, originalCode: string ) => string | SourceDescription;
details:
Type: String[] | RegExp[] | ((path: string) => boolean)
Mandatory
Specifies which import files will be processed by this plugin. Glob patterns are supported.
For functions, take the individual import file name as a parameter, and the Boolean value returned by the function will indicate whether or not to process the file
Examples:
['**/*.css', '*.html', 'path/to/file'];
(path) => path.endsWith('.css');
Type: String[] | RegExp[] | ((path: string) => boolean)
Default: []
Specifies which import files will not be processed by this plugin.
Values are handled in the same way as include
Type: String | (id: string, originalCode: string) => string | SourceDescription
Mandatory
Specifies the content of the imported module.
For functions, the string or SourceDescription value returned by the function will be passed to Rollup to change the content of the file
The plugin context will be this for the function
SourceDescriptionis a rollup interface (see more in Rollup Docs):interface SourceDescription extends Partial<PartialNull<ModuleOptions>> { ast?: ProgramNode; code: string; map?: SourceMapInput; } interface ModuleOptions { attributes: Record<string, string>; meta: CustomPluginOptions; moduleSideEffects: boolean | 'no-treeshake'; syntheticNamedExports: boolean | string; }
Examples:
'export default "custom content";';
(id, originalCode) => `export default ${JSON.stringify(originalCode)};`;
(id, originalCode) => {{ code: `export default ${JSON.stringify(originalCode)};`, map: null, }}
// rollup.config.js import { customImport } from 'rollup-plugin-custom-import'; export default { // ... plugins: [ customImport({ include: ['**/*.txt'], content: (id, originalContent) => `export default ${JSON.stringify(originalContent)};`, }), ], };
// rollup.config.js import { customImport } from 'rollup-plugin-custom-import'; export default { // ... plugins: [ customImport({ include: ['**/*.css'], content: (id, originalContent) => `const css = ${JSON.stringify(originalContent)}; const styleEl = document.createElement('style'); styleEl.innerHTML = css; document.head.appendChild(styleEl); export default css;`, }), ], };
// rollup.config.js import { customImport } from 'rollup-plugin-custom-import'; export default { // ... plugins: [ customImport({ include: ['**/*.html'], content: (id, originalContent) => `const html = ${JSON.stringify(originalContent)}; const div = document.createElement('div'); div.innerHTML = html; export default div;`, }), ], };
// rollup.config.js import { customImport } from 'rollup-plugin-custom-import'; export default { // ... plugins: [ customImport({ include: ['**/*.js'], content(id, originalContent) => { // this.parse is a function provided by Rollup // learn more at https://rollupjs.org/plugin-development/#plugin-context const ast = this.parse(originalContent); const processed = doSomething(); const yourCode = doAnotherThing(); return { code: yourCode, ast: processed, }; }, }), ], };