{"id":22073,"library":"rollup-plugin-import-assets","title":"rollup-plugin-import-assets","description":"A Rollup plugin (version 1.1.1) that allows importing image and other asset files directly in JavaScript, returning the public URL or path. It copies assets to the output directory, supports hashing for cache busting, and works with Rollup >=1.9.0. Unlike similar plugins, it is lightweight and focuses on basic asset import and emission without complex transformations.","status":"active","version":"1.1.1","language":"javascript","source_language":"en","source_url":"https://github.com/domingues/rollup-plugin-import-assets","tags":["javascript","rollup-plugin","assets"],"install":[{"cmd":"npm install rollup-plugin-import-assets","lang":"bash","label":"npm"},{"cmd":"yarn add rollup-plugin-import-assets","lang":"bash","label":"yarn"},{"cmd":"pnpm add rollup-plugin-import-assets","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"peer dependency required to function as a Rollup plugin","package":"rollup","optional":false}],"imports":[{"note":"ESM default import; CommonJS require will fail because the package is ESM-only.","wrong":"const importAssets = require('rollup-plugin-import-assets')","symbol":"default","correct":"import importAssets from 'rollup-plugin-import-assets'"},{"note":"This package only exports a default function, not a named export. Named import will result in undefined.","wrong":"import { importAssets } from 'rollup-plugin-import-assets'","symbol":"importAssets","correct":"import { default as importAssets } from 'rollup-plugin-import-assets'"},{"note":"include must be an array of RegExp, emitAssets is boolean, not string.","wrong":"importAssets({ include: '...', emitAssets: 'true' })","symbol":"config object","correct":"importAssets({ include: [/.../], emitAssets: true })"}],"quickstart":{"code":"// Install: npm install --save-dev rollup rollup-plugin-import-assets\n// rollup.config.js\nimport importAssets from 'rollup-plugin-import-assets';\n\nexport default {\n  input: 'src/main.js',\n  output: {\n    dir: 'public',\n    format: 'esm'\n  },\n  plugins: [\n    importAssets({\n      include: [/\\.(gif|jpg|png|svg)$/i],\n      emitAssets: true,\n      fileNames: 'assets/[name]-[hash].[ext]',\n      publicPath: '/static/'\n    })\n  ]\n};\n\n// src/main.js\nimport logo from './img/logo.png';\nconst img = `<img src=\"${logo}\" />`;","lang":"javascript","description":"Shows basic setup: install, config with asset inclusion, emission to output dir, and usage in code."},"warnings":[{"fix":"Use ES module syntax (import) or switch to a plugin that supports CJS.","message":"Plugin is ESM-only and cannot be used with require() in CommonJS projects.","severity":"breaking","affected_versions":">=1.0.0"},{"fix":"Use RegExp literals or RegExp objects, e.g., [/\\.jpg$/i]","message":"Include patterns must be RegExp objects, not strings or globs.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Set emitAssets: true if you need the file in the output directory.","message":"If emitAssets is false, the imported asset will only return a path string but the file won't be copied.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Use a different plugin if custom hashing or content addressing is needed.","message":"File hashing uses the asset content, but hash algorithm is not configurable; may cause collisions for identical files.","severity":"gotcha","affected_versions":">=1.0.0"}],"env_vars":null,"last_verified":"2026-04-27T00:00:00.000Z","next_check":"2026-07-26T00:00:00.000Z","problems":[{"fix":"Run 'npm install rollup-plugin-import-assets' and ensure package.json has 'type': 'module' or use .mjs extension for config.","cause":"Package not installed or mismatched Node.js version (requires ESM support).","error":"Cannot find module 'rollup-plugin-import-assets'"},{"fix":"Use 'import importAssets from 'rollup-plugin-import-assets'' or 'import { default as importAssets } from 'rollup-plugin-import-assets''.","cause":"Incorrect import: using named import { importAssets } instead of default import.","error":"TypeError: importAssets is not a function"},{"fix":"Ensure each asset matches exactly one include pattern or use exclude to avoid duplicates.","cause":"Asset matched multiple include patterns? Actually, this error appears when including the same file via multiple expressions; not typical.","error":"The plugin 'importAssets' assigned a different code path to an asset."}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}