{"id":19201429,"url":"https://github.com/padcom/vite-plugin-vue-sfc-transform","last_synced_at":"2026-02-18T20:10:36.968Z","repository":{"id":222894081,"uuid":"758661958","full_name":"padcom/vite-plugin-vue-sfc-transform","owner":"padcom","description":null,"archived":false,"fork":false,"pushed_at":"2024-06-14T09:23:05.000Z","size":265,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-10-19T17:55:10.359Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/padcom.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-02-16T19:48:32.000Z","updated_at":"2024-06-14T09:23:05.000Z","dependencies_parsed_at":"2024-11-09T12:38:52.815Z","dependency_job_id":"f9db6050-6b24-4b42-8b2c-b7b22795804a","html_url":"https://github.com/padcom/vite-plugin-vue-sfc-transform","commit_stats":null,"previous_names":["padcom/vite-plugin-vue-sfc-transform"],"tags_count":5,"template":false,"template_full_name":null,"purl":"pkg:github/padcom/vite-plugin-vue-sfc-transform","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/padcom%2Fvite-plugin-vue-sfc-transform","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/padcom%2Fvite-plugin-vue-sfc-transform/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/padcom%2Fvite-plugin-vue-sfc-transform/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/padcom%2Fvite-plugin-vue-sfc-transform/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/padcom","download_url":"https://codeload.github.com/padcom/vite-plugin-vue-sfc-transform/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/padcom%2Fvite-plugin-vue-sfc-transform/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29594242,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-02-18T18:54:29.675Z","status":"ssl_error","status_checked_at":"2026-02-18T18:50:50.517Z","response_time":162,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-09T12:38:43.079Z","updated_at":"2026-02-18T20:10:36.938Z","avatar_url":"https://github.com/padcom.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Vite plugin for Vue.js SFC source manipulations\n\nThere are cases where to implement something in your code you would have to go through every single file in your project and do something to it. Some of those modifications are trivial and will stay there forever. Some are different and will change over time.\n\nFor those cases in other platforms, like Java or .NET, there is a concept of [aspect-oriented programming (AOP)](https://en.wikipedia.org/wiki/Aspect-oriented_programming). The idea behind it is that during compilation you get to transform the original source to either add, remove or change some of it to implement some cross-cutting concern in your system.\n\nThe best example here is the case of feature flags.\n\nImagine you would like to put a `v-if=\"featureFlags.test('\u003cfeature-id-here\u003e')` in every single component. If you polute your codebase with those `v-if`s you will loose clarity and readability. Some components might already have some conditional rendering and extending the expression will only make it worse.\n\nThis is where AOP comes into play.\n\nIt allows you to post-process your file, fish out those places that need to be augmented, do the augmentation and continue on with the regular compilation process as if those were the original source - just with an added concern.\n\n## Installation\n\nTo make use of this plugin you need to first install it:\n\n```\nnpm install --save-dev @padcom/vite-plugin-vue-sfc-transform\n```\n\n## Usage\n\nOnce the plugin is installed you need to use it in your config file:\n\n```typescript\nimport { defineConfig } from 'vite'\nimport vue from '@vitejs/plugin-vue'\nimport transform, { type Section } from '@padcom/vite-plugin-vue-sfc-transform'\n\nfunction transformer(filename: string, sections: Section[]): Section[] {\n  // do something to any of those sections\n  // you can also add/remove sections or completely redefine the sections\n\n  return sections\n}\n\nexport default defineConfig({\n  plugins: [\n    transform({\n      transformer: transformer,\n    }),\n    vue(),\n  ],\n})\n```\n\n## API\n\nThe API for this plugin is very simple and delegates most of the hard work to you. I know, it could do more, but the number of different ways you can transform sources is so vast that I won't get in your way.\n\n### Vite plugin options\n\nYou can specify the following plugin options:\n\n### `transformer`\n\nThis is a function that transforms sections of the component. It is given the `filename` (relative to project root), so that you know what you are transforming. This allows you to make different changes depending on which file you are transforming.\n\nIf not specified a noop will be used meaning no transformations take place.\n\n### `includes`\n\nThis is a list of files/glob patterns that will be included in the transformation. By default all `.vue` files in the `src` folder will be used (`['src/**/*.vue']`)\n\nFor a file to be processed it must be included and not excluded at the same time.\n\n### `excludes`\n\nThis is a list of files/glob patterns that will be excluded from the processing. By default all files in the `node_modules` are excluded (`['node_modules/**/*']`)\n\n### `debug`\n\nThis enables dumping the modified files to a folder for inspection. This isn't strictly necessary but if you find yourself wondering what the heck is going on it is a nice to have option. It is disabled by default.\n\n### `debugPath`\n\nThis is the root path where modified sources will be dumped for inspection. By default the path is constructed from `{root}/dist` and name of the `transformer` function (`./dist/${transformer.name}`)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpadcom%2Fvite-plugin-vue-sfc-transform","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpadcom%2Fvite-plugin-vue-sfc-transform","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpadcom%2Fvite-plugin-vue-sfc-transform/lists"}