{"id":16739322,"url":"https://github.com/ariperkkio/vite-plugin-source-map-visualizer","last_synced_at":"2025-03-17T01:32:01.826Z","repository":{"id":253678849,"uuid":"844201541","full_name":"AriPerkkio/vite-plugin-source-map-visualizer","owner":"AriPerkkio","description":"Vite plugin for generating source map visualizations of transform results","archived":false,"fork":false,"pushed_at":"2024-09-15T16:56:03.000Z","size":2015,"stargazers_count":11,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2024-10-14T00:50:04.073Z","etag":null,"topics":["developer-experience","source-maps","vite"],"latest_commit_sha":null,"homepage":"https://ariperkkio.github.io/vite-plugin-source-map-visualizer","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/AriPerkkio.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-08-18T17:24:31.000Z","updated_at":"2024-09-15T16:56:06.000Z","dependencies_parsed_at":"2024-09-15T18:00:33.898Z","dependency_job_id":"ab3471b2-a20a-4eef-b323-593810dc3bd1","html_url":"https://github.com/AriPerkkio/vite-plugin-source-map-visualizer","commit_stats":null,"previous_names":["ariperkkio/vite-plugin-source-map-visualizer"],"tags_count":8,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AriPerkkio%2Fvite-plugin-source-map-visualizer","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AriPerkkio%2Fvite-plugin-source-map-visualizer/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AriPerkkio%2Fvite-plugin-source-map-visualizer/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AriPerkkio%2Fvite-plugin-source-map-visualizer/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/AriPerkkio","download_url":"https://codeload.github.com/AriPerkkio/vite-plugin-source-map-visualizer/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":221670315,"owners_count":16861052,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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":["developer-experience","source-maps","vite"],"created_at":"2024-10-13T00:50:12.397Z","updated_at":"2024-10-27T11:43:34.735Z","avatar_url":"https://github.com/AriPerkkio.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# vite-plugin-source-map-visualizer\n\n\u003ca href=\"https://www.npmjs.com/package/vite-plugin-source-map-visualizer\"\u003e\n    \u003cimg alt=\"version\" src=\"https://img.shields.io/npm/v/vite-plugin-source-map-visualizer\" /\u003e\n\u003c/a\u003e\n\n[Installation](#installation) | [Configuration](#configuration) | [Credits](#credits)\n\n\u003e Vite plugin for generating source map visualizations of transform results\n\n`vite-plugin-source-map-visualizer` is a Vite plugin for inspecting source maps of the transformed files. It generates HTML report that provides quick way for seeing how the tranformed files look in [source-map-visualization](https://github.com/evanw/source-map-visualization). See [live example](https://ariperkkio.github.io/vite-plugin-source-map-visualizer/).\n\nFor more detailed plugin debugging tool you might want to check [`vite-plugin-inspect`](https://github.com/antfu-collective/vite-plugin-inspect) instead.\n\n\u003cbr /\u003e\n\n[vite-plugin-source-map-visualizer.webm](https://github.com/user-attachments/assets/f93039d9-da22-459d-b933-1a49467e67a9)\n\n\u003cbr /\u003e\n\u003cbr /\u003e\n\n## Installation\n\n```bash\n$ npm install --save-dev vite-plugin-source-map-visualizer\n```\n\n```ts\nimport { defineConfig } from \"vite\";\nimport { sourcemapVisualizer } from \"vite-plugin-source-map-visualizer\";\n\nexport default defineConfig({\n  plugins: [sourcemapVisualizer()],\n});\n```\n\nRun Vite and check `.vite-source-map-visualizer/report.html`:\n\n```\n└── .vite-source-map-visualizer\n    └── report.html\n```\n\n## Configuration\n\nYou can pass options to the plugin as function arguments:\n\n```ts\nexport default defineConfig({\n  plugins: [\n    sourcemapVisualizer({\n      filename: \"my-report.html\",\n    }),\n  ],\n});\n```\n\n### `filename`\n\nFilename for the report. Defaults to `report.html`.\n\n### `outDir`\n\nDirectory for the output. Defaults to `.vite-source-map-visualizer`.\n\n### `silent`\n\nSilence plugin's verbose logging.\n\n### `formatName`\n\nFormat name of the files:\n\n```ts\nexport default defineConfig({\n  plugins: [\n    sourcemapVisualizer({\n      formatName: (filename) =\u003e filename.replace(\"src/\", \"/\"),\n    }),\n  ],\n});\n```\n\n## Credits\n\nSpecial thanks to:\n\n- [`vite-plugin-inspect`](https://github.com/antfu-collective/vite-plugin-inspect) from [@antfu](https://github.com/antfu)\n- [source-map-visualization](https://github.com/evanw/source-map-visualization) from [@evanw](https://github.com/evanw)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fariperkkio%2Fvite-plugin-source-map-visualizer","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fariperkkio%2Fvite-plugin-source-map-visualizer","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fariperkkio%2Fvite-plugin-source-map-visualizer/lists"}