{"id":19324894,"url":"https://github.com/spatie/sidecar-shiki","last_synced_at":"2025-04-07T07:06:16.958Z","repository":{"id":40593173,"uuid":"507092931","full_name":"spatie/sidecar-shiki","owner":"spatie","description":"Run Shiki highlighting with Sidecar","archived":false,"fork":false,"pushed_at":"2025-01-27T04:23:52.000Z","size":2706,"stargazers_count":35,"open_issues_count":0,"forks_count":1,"subscribers_count":4,"default_branch":"main","last_synced_at":"2025-03-31T05:07:03.922Z","etag":null,"topics":["aws-lambda","highlighting","shiki","sidecar"],"latest_commit_sha":null,"homepage":"https://spatie.be/open-source","language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/spatie.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE.md","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":"2022-06-24T17:28:57.000Z","updated_at":"2025-01-27T04:23:50.000Z","dependencies_parsed_at":"2024-02-13T10:24:30.338Z","dependency_job_id":"572eded9-17d6-4816-a61a-0258492a89ab","html_url":"https://github.com/spatie/sidecar-shiki","commit_stats":{"total_commits":27,"total_committers":5,"mean_commits":5.4,"dds":0.5925925925925926,"last_synced_commit":"eb9b0c048da23c88f87315a3dfa13125b6fe10d8"},"previous_names":[],"tags_count":7,"template":false,"template_full_name":"spatie/package-skeleton-laravel","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/spatie%2Fsidecar-shiki","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/spatie%2Fsidecar-shiki/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/spatie%2Fsidecar-shiki/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/spatie%2Fsidecar-shiki/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/spatie","download_url":"https://codeload.github.com/spatie/sidecar-shiki/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247608151,"owners_count":20965952,"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":["aws-lambda","highlighting","shiki","sidecar"],"created_at":"2024-11-10T02:07:23.561Z","updated_at":"2025-04-07T07:06:16.936Z","avatar_url":"https://github.com/spatie.png","language":"PHP","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n[\u003cimg src=\"https://github-ads.s3.eu-central-1.amazonaws.com/support-ukraine.svg?t=1\" /\u003e](https://supportukrainenow.org)\n\n# Run Shiki highlighting with Sidecar\n\n[![Latest Version on Packagist](https://img.shields.io/packagist/v/spatie/sidecar-shiki.svg?style=flat-square)](https://packagist.org/packages/spatie/sidecar-shiki)\n[![GitHub Tests Action Status](https://img.shields.io/github/workflow/status/spatie/sidecar-shiki/run-tests?label=tests)](https://github.com/spatie/sidecar-shiki/actions?query=workflow%3Arun-tests+branch%3Amain)\n[![GitHub Code Style Action Status](https://img.shields.io/github/workflow/status/spatie/sidecar-shiki/Check%20\u0026%20fix%20styling?label=code%20style)](https://github.com/spatie/sidecar-shiki/actions?query=workflow%3A\"Check+%26+fix+styling\"+branch%3Amain)\n[![Total Downloads](https://img.shields.io/packagist/dt/spatie/sidecar-shiki.svg?style=flat-square)](https://packagist.org/packages/spatie/sidecar-shiki)\n\n[Shiki](https://github.com/shikijs/shiki) is a beautiful syntax highlighter powered by the same language engine that many code editors use.  This package allows you to run [Shiki](https://github.com/shikijs/shiki) on AWS Lambda through [Sidecar](https://github.com/hammerstonedev/sidecar).\n\nYou won't need to install Node, or any of Shiki's dependencies, on your server.\n\n## Support us\n\n[\u003cimg src=\"https://github-ads.s3.eu-central-1.amazonaws.com/sidecar-shiki.jpg?t=1\" width=\"419px\" /\u003e](https://spatie.be/github-ad-click/sidecar-shiki)\n\nWe invest a lot of resources into creating [best in class open source packages](https://spatie.be/open-source). You can support us by [buying one of our paid products](https://spatie.be/open-source/support-us).\n\nWe highly appreciate you sending us a postcard from your hometown, mentioning which of our package(s) you are using. You'll find our address on [our contact page](https://spatie.be/about-us). We publish all received postcards on [our virtual postcard wall](https://spatie.be/open-source/postcards).\n\n## Requirements\n\nThis package requires that `hammerstone/sidecar` has been installed in your Laravel application.\n\nFollow the [Sidecar installation](https://hammerstone.dev/sidecar/docs/main/installation) and [configuration](https://hammerstone.dev/sidecar/docs/main/configuration) instructions.\n\n## Installation\n\nYou can install the package via composer:\n\n```bash\ncomposer require spatie/sidecar-shiki\n```\n\nOptionally, you can publish the config file with:\n\n```bash\nphp artisan vendor:publish --tag=\"sidecar-shiki-config\"\n```\n\nRegister the `HighlightFunction::class` in your `sidecar.php` config file.\n\n```php\n/*\n * All of your function classes that you'd like to deploy go here.\n */\n'functions' =\u003e [\n    \\Spatie\\SidecarShiki\\Functions\\HighlightFunction::class,\n],\n```\n\nDeploy the Lambda function by running:\n\n```shell\nphp artisan sidecar:deploy --activate\n```\n\nSee [Sidecar documentation](https://hammerstone.dev/sidecar/docs/main/functions/deploying) for details.\n\n## Usage\n\nYou can highlight code by calling the `\\Spatie\\SidecarShiki\\SidecarShiki::highlight()` function.\n\n```php\nuse Spatie\\SidecarShiki\\SidecarShiki;\n\nSidecarShiki::highlight(\n    code: '\u003c?php echo \"Hello World\"; ?\u003e',\n    language: 'php',\n    theme: 'github-light',\n);\n```\n\nThe output is this chunk of HTML rendered through AWS Lambda which will output beautifully in the browser:\n\n```html\n\u003cpre class=\"shiki\" style=\"background-color: #2e3440ff\"\u003e\u003ccode\u003e\u003cspan class=\"line\"\u003e\u003cspan style=\"color: #81A1C1\"\u003e\u0026lt;?\u003c/span\u003e\u003cspan style=\"color: #D8DEE9FF\"\u003ephp \u003c/span\u003e\u003cspan style=\"color: #81A1C1\"\u003eecho\u003c/span\u003e\u003cspan style=\"color: #D8DEE9FF\"\u003e \u003c/span\u003e\u003cspan style=\"color: #ECEFF4\"\u003e\u0026quot;\u003c/span\u003e\u003cspan style=\"color: #A3BE8C\"\u003eHello World\u003c/span\u003e\u003cspan style=\"color: #ECEFF4\"\u003e\u0026quot;\u003c/span\u003e\u003cspan style=\"color: #81A1C1\"\u003e;\u003c/span\u003e\u003cspan style=\"color: #D8DEE9FF\"\u003e \u003c/span\u003e\u003cspan style=\"color: #81A1C1\"\u003e?\u0026gt;\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\n```\n\n### Marking lines as highlighted, added, deleted or focus\n\n```php\nuse Spatie\\SidecarShiki\\SidecarShiki;\n\n// Highlighting lines 1 and 4,5,6\nSidecarShiki::highlight(\n    code: $code,\n    language: 'php',\n    highlightLines: [1, '4-6'],\n);\n\n// Marking line 1 as added\nSidecarShiki::highlight(\n    code: $code,\n    language: 'php',\n    addLines: [1],\n);\n\n// Marking line 1 as deleted\nSidecarShiki::highlight(\n    code: $code,\n    language: 'php',\n    deleteLines: [1],\n);\n\n// Marking line 1 as focus\nSidecarShiki::highlight(\n    code: $code,\n    language: 'php',\n    focusLines: [1],\n);\n```\n\nYou can then target these classes in your own CSS to color these lines how you want.\n\n### Using the Commonmark HighlightCodeExtension\n\nHere's how we can create a function that can convert markdown to HTML with all code snippets highlighted. Inside the function we'll create a new MarkdownConverter that uses the HighlightCodeExtension provided by this package.\n\nThe `$theme` argument on `HighlightCodeExtension` expects the name of [one of the many themes](https://github.com/shikijs/shiki/blob/master/docs/themes.md) that Shiki supports.\n\n```php\nuse League\\CommonMark\\Environment\\Environment;\nuse League\\CommonMark\\Extension\\CommonMark\\CommonMarkCoreExtension;\nuse League\\CommonMark\\MarkdownConverter;\nuse Spatie\\SidecarShiki\\Commonmark\\HighlightCodeExtension;\n\nfunction convertToHtml(string $markdown, string $theme): string\n{\n    $environment = (new Environment())\n        -\u003eaddExtension(new CommonMarkCoreExtension())\n        -\u003eaddExtension(new HighlightCodeExtension($theme));\n\n    $markdownConverter = new MarkdownConverter(environment: $environment);\n\n    return $markdownConverter-\u003econvertToHtml($markdown);\n}\n```\n\n## Testing\n\nThe testsuite makes connections to AWS and runs the deployed Lambda function. In order to run the testsuite, you will need an active [AWS account](https://aws.amazon.com/).\n\nWe can use the native `sidecar:configure` artisan command to create the necessary AWS credentials for Sidecar. First copy the testbench.example.yaml file to testbench.yaml. Then run `./vendor/bin/testbench sidecar:configure` to start the Sidecar setup process. (You only have to do the setup once)\n\n```shell\ncp testbench.yaml.example testbench.yaml\ncp .env.example .env\n./vendor/bin/testbench sidecar:configure\n```\n\nAfter finishing the Sidecar setup process, you will have received a couple of SIDECAR_* environment variables. Add these credentials to both `.env` and `testbench.yaml`.\n\nNow we can deploy our local `HighlightFunction` to AWS Lambda. Run the following command in your terminal, before executing the testsuite.\n\n```shell\n./vendor/bin/testbench sidecar-shiki:setup\n```\n\nAfter the successful deployment, you can run the testsuite.\n\n```bash\ncomposer test\n```\n\n## Changelog\n\nPlease see [CHANGELOG](CHANGELOG.md) for more information on what has changed recently.\n\n## Contributing\n\nPlease see [CONTRIBUTING](https://github.com/spatie/.github/blob/main/CONTRIBUTING.md) for details.\n\n## Security Vulnerabilities\n\nPlease review [our security policy](../../security/policy) on how to report security vulnerabilities.\n\n## Credits\n\n- [Rias Van der Veken](https://github.com/riasvdv)\n- [All Contributors](../../contributors)\n\nSpecial thanks to [Stefan Zweifel]() for his [sidecar-browsershot](https://github.com/stefanzweifel/sidecar-browsershot) package as a big help in how to test this.\n\n## Alternatives\n\nIf you don't want to install and handle Shiki yourself, take a look at [Torchlight](https://torchlight.dev), which can highlight your code with minimal setup.\n\n## License\n\nThe MIT License (MIT). Please see [License File](LICENSE.md) for more information.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fspatie%2Fsidecar-shiki","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fspatie%2Fsidecar-shiki","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fspatie%2Fsidecar-shiki/lists"}