PHPackages                             spatie/laravel-blade-javascript - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Templating &amp; Views](/categories/templating)
4. /
5. spatie/laravel-blade-javascript

ActiveLibrary[Templating &amp; Views](/categories/templating)

spatie/laravel-blade-javascript
===============================

A Blade directive to export variables to JavaScript

2.9.0(2mo ago)638855.8k—6.4%379MITPHPPHP ^8.0CI passing

Since Jun 5Pushed 2mo ago15 watchersCompare

[ Source](https://github.com/spatie/laravel-blade-javascript)[ Packagist](https://packagist.org/packages/spatie/laravel-blade-javascript)[ Docs](https://github.com/spatie/laravel-blade-javascript)[ Fund](https://spatie.be/open-source/support-us)[ RSS](/packages/spatie-laravel-blade-javascript/feed)WikiDiscussions master Synced 1mo ago

READMEChangelog (10)Dependencies (5)Versions (31)Used By (9)

A Blade directive to export variables to JavaScript
===================================================

[](#a-blade-directive-to-export-variables-to-javascript)

[![Latest Version on Packagist](https://camo.githubusercontent.com/2635460750ade76cb0ea13f17ad0411afb5ed62c570ecbf29b8713a46f04a10a/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f7370617469652f6c61726176656c2d626c6164652d6a6176617363726970742e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/spatie/laravel-blade-javascript)[![Software License](https://camo.githubusercontent.com/55c0218c8f8009f06ad4ddae837ddd05301481fcf0dff8e0ed9dadda8780713e/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f6c6963656e73652d4d49542d627269676874677265656e2e7376673f7374796c653d666c61742d737175617265)](LICENSE.md)[![run-tests](https://github.com/spatie/laravel-blade-javascript/actions/workflows/run-tests.yml/badge.svg)](https://github.com/spatie/laravel-blade-javascript/actions/workflows/run-tests.yml)[![Check & fix styling](https://github.com/spatie/laravel-blade-javascript/workflows/Check%20&%20fix%20styling/badge.svg)](https://github.com/spatie/laravel-blade-javascript/workflows/Check%20&%20fix%20styling/badge.svg)[![Total Downloads](https://camo.githubusercontent.com/eaab496c5192b777da583953bf9fdd62c5c7813062a8b3b7d287d36e8704c9be/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f7370617469652f6c61726176656c2d626c6164652d6a6176617363726970742e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/spatie/laravel-blade-javascript)

This package contains a Blade directive to export values to JavaScript.

Here's an example of how it can be used:

```
@javascript('key', 'value')
```

The rendered view will output:

```
window['key'] = 'value';
```

So in your browser you now have access to a key variable:

```
console.log(key); //outputs "value"
```

Spatie is a webdesign agency based in Antwerp, Belgium. You'll find an overview of all our open source projects [on our website](https://spatie.be/opensource).

Support us
----------

[](#support-us)

[![](https://camo.githubusercontent.com/6b94880b14f464b8f9a4fffe8efa38eb35154f1e33d47094a018c81d3a80d41b/68747470733a2f2f6769746875622d6164732e73332e65752d63656e7472616c2d312e616d617a6f6e6177732e636f6d2f6c61726176656c2d626c6164652d6a6176617363726970742e6a70673f743d31)](https://spatie.be/github-ad-click/laravel-blade-javascript)

We 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).

We 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).

Installation
------------

[](#installation)

You can install the package via composer:

```
composer require spatie/laravel-blade-javascript
```

The package will automatically register itself.

Optionally the config file can be published with

```
php artisan vendor:publish --provider="Spatie\BladeJavaScript\BladeJavaScriptServiceProvider" --tag="config"
```

This is the contents of the published config file:

```
return [

    /**
     * All passed values will be present in this JavaScript namespace. Set this to an empty string
     * to use the window object.
     */
    'namespace' => '',
];
```

If you want to customize the generated `` tag you can publish and override the used view.

```
php artisan vendor:publish --provider="Spatie\BladeJavaScript\BladeJavaScriptServiceProvider" --tag="views"
```

After this you can edit the published view `resources/views/vendor/bladeJavaScript/index.blade.php`. This is usefull to add the `type` or a CSP `nonce`.

Usage
-----

[](#usage)

With the package installed you can make use of a `@javascript` Blade directive.

```
@javascript('key', 'value')
```

The rendered view will output:

```
key = 'value';
```

You can also use a single argument:

```
@javascript(['key' => 'value'])
```

This will also output:

```
key = 'value';
```

When setting the namespace to eg `js` in the config file this will be the output:

```
window['js'] = window['js'] || {};js['key'] = 'value';
```

Changelog
---------

[](#changelog)

Please see [CHANGELOG](CHANGELOG.md) for more information what has changed recently.

Testing
-------

[](#testing)

```
composer test
```

Contributing
------------

[](#contributing)

Please see [CONTRIBUTING](https://github.com/spatie/.github/blob/main/CONTRIBUTING.md) for details.

Security
--------

[](#security)

If you've found a bug regarding security please mail  instead of using the issue tracker.

Credits
-------

[](#credits)

- [Freek Van der Herten](https://github.com/freekmurze)
- [Sebastian De Deyne](https://github.com/seb)
- [All Contributors](../../contributors)

This repository contains some code from the [laracasts/PHP-Vars-To-Js-Transformer](https://github.com/laracasts/PHP-Vars-To-Js-Transformer) package written by [Jeffrey Way](https://github.com/JeffreyWay).

License
-------

[](#license)

The MIT License (MIT). Please see [License File](LICENSE.md) for more information.

###  Health Score

68

—

FairBetter than 100% of packages

Maintenance83

Actively maintained with recent releases

Popularity59

Moderate usage in the ecosystem

Community37

Small or concentrated contributor base

Maturity79

Established project with proven stability

 Bus Factor1

Top contributor holds 50.7% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~126 days

Recently: every ~375 days

Total

29

Last Release

87d ago

Major Versions

0.0.1 → 1.0.02016-06-07

1.1.0 → 2.0.02017-08-31

PHP version history (6 changes)0.0.1PHP ^7.0

2.2.2PHP ^7.1

2.3.0PHP ^7.2

2.6.0PHP ^7.2|^8.0

2.7.0PHP ^7.2|^8.0|^8.1

2.7.1PHP ^8.0

### Community

Maintainers

![](https://avatars.githubusercontent.com/u/7535935?v=4)[Spatie](/maintainers/spatie)[@spatie](https://github.com/spatie)

---

Top Contributors

[![freekmurze](https://avatars.githubusercontent.com/u/483853?v=4)](https://github.com/freekmurze "freekmurze (73 commits)")[![rubenvanassche](https://avatars.githubusercontent.com/u/619804?v=4)](https://github.com/rubenvanassche "rubenvanassche (17 commits)")[![sebastiandedeyne](https://avatars.githubusercontent.com/u/1561079?v=4)](https://github.com/sebastiandedeyne "sebastiandedeyne (10 commits)")[![AdrianMrn](https://avatars.githubusercontent.com/u/12762044?v=4)](https://github.com/AdrianMrn "AdrianMrn (7 commits)")[![erikn69](https://avatars.githubusercontent.com/u/4933954?v=4)](https://github.com/erikn69 "erikn69 (7 commits)")[![riasvdv](https://avatars.githubusercontent.com/u/3626559?v=4)](https://github.com/riasvdv "riasvdv (4 commits)")[![laravel-shift](https://avatars.githubusercontent.com/u/15991828?v=4)](https://github.com/laravel-shift "laravel-shift (4 commits)")[![Gummibeer](https://avatars.githubusercontent.com/u/6187884?v=4)](https://github.com/Gummibeer "Gummibeer (2 commits)")[![alexmanase](https://avatars.githubusercontent.com/u/10696975?v=4)](https://github.com/alexmanase "alexmanase (2 commits)")[![AlexVanderbist](https://avatars.githubusercontent.com/u/6287961?v=4)](https://github.com/AlexVanderbist "AlexVanderbist (2 commits)")[![rodrigopedra](https://avatars.githubusercontent.com/u/5470108?v=4)](https://github.com/rodrigopedra "rodrigopedra (2 commits)")[![fridzema](https://avatars.githubusercontent.com/u/8180660?v=4)](https://github.com/fridzema "fridzema (1 commits)")[![codyphobe](https://avatars.githubusercontent.com/u/207072?v=4)](https://github.com/codyphobe "codyphobe (1 commits)")[![jeffersongoncalves](https://avatars.githubusercontent.com/u/411493?v=4)](https://github.com/jeffersongoncalves "jeffersongoncalves (1 commits)")[![jkudish](https://avatars.githubusercontent.com/u/260253?v=4)](https://github.com/jkudish "jkudish (1 commits)")[![blueclock](https://avatars.githubusercontent.com/u/586174?v=4)](https://github.com/blueclock "blueclock (1 commits)")[![m1guelpf](https://avatars.githubusercontent.com/u/23558090?v=4)](https://github.com/m1guelpf "m1guelpf (1 commits)")[![Nielsvanpach](https://avatars.githubusercontent.com/u/10651054?v=4)](https://github.com/Nielsvanpach "Nielsvanpach (1 commits)")[![PaolaRuby](https://avatars.githubusercontent.com/u/79208489?v=4)](https://github.com/PaolaRuby "PaolaRuby (1 commits)")[![BackEndTea](https://avatars.githubusercontent.com/u/14289961?v=4)](https://github.com/BackEndTea "BackEndTea (1 commits)")

---

Tags

apibladejavascriptlaravelphpviewspatielaraveljavascriptbladedirectivelaravel-blade-javascript

###  Code Quality

TestsPest

### Embed Badge

![Health badge](/badges/spatie-laravel-blade-javascript/health.svg)

```
[![Health](https://phpackages.com/badges/spatie-laravel-blade-javascript/health.svg)](https://phpackages.com/packages/spatie-laravel-blade-javascript)
```

###  Alternatives

[spatie/laravel-blade-comments

Add debug comments to your rendered output

177325.5k](/packages/spatie-laravel-blade-comments)[radic/blade-extensions

Laravel package providing additional Blade extensions: foreach (with $loop data like twig), break, continue, set,array (multiline), etc

271321.7k5](/packages/radic-blade-extensions)[angus-mcritchie/blade-boost-directive

Lightning-Fast Blade Components with `@boost` Directive

3910.0k](/packages/angus-mcritchie-blade-boost-directive)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)
