{"id":26780,"library":"babel-plugin-transform-assets","title":"babel-plugin-transform-assets","description":"A Babel plugin (v1.0.2, stable) that compiles asset imports (e.g., .txt, .svg) at compile time, replacing them with hashed filenames. Eliminates the need for Webpack in universal server-side code, providing a lightweight alternative to file-loader/url-loader. Works with Babel 6+. Last updated in 2017; not actively maintained.","status":"maintenance","version":"1.0.2","language":"javascript","source_language":"en","source_url":"https://github.com/jmurzy/babel-plugin-transform-assets","tags":["javascript","babel","webpack","file-loader","babel-plugin","asset","require","import","hook"],"install":[{"cmd":"npm install babel-plugin-transform-assets","lang":"bash","label":"npm"},{"cmd":"yarn add babel-plugin-transform-assets","lang":"bash","label":"yarn"},{"cmd":"pnpm add babel-plugin-transform-assets","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"The plugin is a default export; use default import in ESM.","wrong":"const plugin = require('babel-plugin-transform-assets').default","symbol":"default plugin","correct":"import plugin from 'babel-plugin-transform-assets'"},{"note":"Plugin typically requires options; omitting options may cause unexpected behavior.","wrong":"plugins: ['babel-plugin-transform-assets']","symbol":"Babel config object","correct":"plugins: [['babel-plugin-transform-assets', { extensions: ['svg'], name: '[name].[ext]?[hash]' }]]"}],"quickstart":{"code":"// .babelrc\n{\n  \"plugins\": [\n    [\"babel-plugin-transform-assets\", {\n      \"extensions\": [\"svg\", \"png\", \"jpg\"],\n      \"name\": \"[name].[ext]?[sha512:hash:base64:7]\"\n    }]\n  ]\n}\n\n// Input:\nimport file from './file.svg';\n// Output:\nvar file = 'file.svg?abc1234';","lang":"javascript","description":"Configures the plugin with file extensions and hashing pattern; shows the transformation of an SVG import."},"warnings":[{"fix":"Consider using babel-plugin-assets or inline assets via Webpack/Metro bundler for modern projects.","message":"The package is no longer actively maintained; last update 2017.","severity":"deprecated","affected_versions":">=1.0.0"},{"fix":"Use Babel 6 or fork/update the plugin for Babel 7 compatibility.","message":"Plugin only works with Babel 6; not compatible with Babel 7+.","severity":"breaking","affected_versions":"1.0.0 - 1.0.2"},{"fix":"Use static import statements only; for dynamic assets, consider Webpack's file-loader.","message":"The plugin transforms import/require statements at compile time, so dynamic imports (e.g., import()) are not supported.","severity":"gotcha","affected_versions":">=1.0.0"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Ensure 'babel-plugin-transform-assets' is installed and listed in plugins array.","cause":"Missing or incorrect plugin name in Babel config.","error":"The plugin was not found. Check the plugins option."},{"fix":"Run: npm install babel-plugin-transform-assets","cause":"Plugin not installed or node_modules missing.","error":"Cannot find module 'babel-plugin-transform-assets'"},{"fix":"Add the extension to the 'extensions' array in plugin options.","cause":"Plugin not configured to handle that file extension.","error":"SyntaxError: Unexpected token (1:20) when importing a file"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}