{"id":22889,"library":"vite-plugin-transform","title":"vite-plugin-transform","description":"Vite plugin for transforming resources during build, supporting regex replacement, alias resolution, and custom callback functions. Current stable version is 2.0.1, released occasionally with breaking changes from v1.x. Key differentiators: allows both simple key-value replacement and advanced path resolution using custom delimiters (e.g., %{ }%). Alternatives: @rollup/plugin-replace, vite-plugin-html. Note: v2.x changed default delimiters from #{ }% to %{ }% and alias handling.","status":"active","version":"2.0.1","language":"javascript","source_language":"en","source_url":"https://github.com/Silksofthesoul/vite-plugin-transform","tags":["javascript","vite","vite-plugin","replace","transform","resolve","bundle"],"install":[{"cmd":"npm install vite-plugin-transform","lang":"bash","label":"npm"},{"cmd":"yarn add vite-plugin-transform","lang":"bash","label":"yarn"},{"cmd":"pnpm add vite-plugin-transform","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency; plugin requires Vite's plugin API","package":"vite","optional":false},{"reason":"Used for string manipulation with source maps","package":"magic-string","optional":false}],"imports":[{"note":"ESM-only; CommonJS require() will fail in Vite config (ESM context). Default export is the plugin function.","wrong":"const transformPlugin = require('vite-plugin-transform')","symbol":"default","correct":"import transformPlugin from 'vite-plugin-transform'"},{"note":"No named export; always use default import.","wrong":"import { transformPlugin } from 'vite-plugin-transform'","symbol":"transformPlugin","correct":"import transformPlugin from 'vite-plugin-transform'"},{"note":"TypeScript users: import type for options. Not exported as a value.","wrong":null,"symbol":"PluginOptions","correct":"import type { PluginOptions } from 'vite-plugin-transform'"}],"quickstart":{"code":"// vite.config.js\nimport { defineConfig } from 'vite';\nimport vue from '@vitejs/plugin-vue';\nimport transformPlugin from 'vite-plugin-transform';\n\nexport default defineConfig({\n  plugins: [\n    vue(),\n    transformPlugin({\n      tStart: '%{',\n      tEnd: '}%',\n      alias: {\n        '@': '/src',\n      },\n      replace: {\n        'REPLACE_ME': 'Hello Friends!',\n      },\n      exclude: ['node_modules'],\n      callbackArray: [\n        str => str.replace(/old/gi, 'new'),\n      ],\n    }),\n  ],\n  resolve: {\n    alias: {\n      '@': '/src',\n    },\n  },\n});","lang":"javascript","description":"Basic setup of vite-plugin-transform with custom delimiters (%{ }%), alias resolution, key-value replacement, and custom callback."},"warnings":[{"fix":"Set tStart: '#{' and tEnd: '}%' in options to restore v1 behavior, or update your template syntax to use %{key}%.","message":"Default delimiters changed from #{ }% to %{ }% in v2.0.0. Old syntax #{key}% will not work without explicit configuration.","severity":"breaking","affected_versions":">=2.0.0"},{"fix":"Add 'node_modules' to the 'exclude' array (it is already excluded) or set 'exclude: []' to process node_modules.","message":"Alias resolution only works in non-node_modules files by default; files in node_modules are excluded unless explicitly included.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Replace 'resolve' with 'alias' in plugin options.","message":"The 'resolve' option in v1.x was deprecated; use 'alias' instead since v2.0.0.","severity":"deprecated","affected_versions":">=2.0.0"},{"fix":"Ensure callbacks return the full transformed content, not just a line.","message":"Transformer functions in 'callbackArray' receive the entire file content (string) and must return the modified content. Not per-line.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Use a function in callbackArray for regex replacement: str => str.replace(/pattern/g, 'replacement').","message":"The 'replace' option performs simple string replacement, not regex. For regex, use 'callbackArray'.","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 --save-dev vite-plugin-transform' and ensure you are in the correct directory.","cause":"Package not installed or installed as devDependency but not found.","error":"Error: Cannot find module 'vite-plugin-transform'"},{"fix":"Use 'import transformPlugin from 'vite-plugin-transform'' (no curly braces).","cause":"Importing named export instead of default export.","error":"TypeError: transformPlugin is not a function"},{"fix":"Set tStart to a string like '%{' (not an array).","cause":"Using array or object instead of string for tStart/tEnd.","error":"The 'tStart' option requires a string value"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}