Gubler/ElixirBundle
Gubler/ElixirBundle
is a small Symfony bundle to add an elixr()
twig function. This function will allow you to
use Laravel Elixir's versioning just like if you
were using it in a Laravel blade template (most of the code was taken
from Laravel/Framework)., (*1)
Installation
Step 1: Install Elixir
Follow Laravel Elixir's installation instructions to install Elixir., (*2)
You will need to add a package.json
file for your application. Here is an example package.json
with the requirements
for Elixir:, (*3)
{
"private": true,
"scripts": {
"prod": "gulp --production",
"dev": "gulp watch"
},
"devDependencies": {
"gulp": "^3.9.1",
"laravel-elixir": "^6.0.0-14",
"laravel-elixir-vue-2": "^0.2.0",
"laravel-elixir-webpack-official": "^1.0.2",
}
}
Step 2: Download the Bundle
Open a command console, enter your project directory and execute the following command to download the latest stable
version of this bundle:, (*4)
$ composer require gubler/elixir-bundle
This command requires you to have Composer installed globally, as explained
in the installation chapter of the Composer documentation., (*5)
Step 3: Enable the Bundle
Then, enable the bundle by adding it to the list of registered bundles
in the app/AppKernel.php
file of your project:, (*6)
<?php
// app/AppKernel.php
// ...
class AppKernel extends Kernel
{
public function registerBundles()
{
$bundles = array(
// ...
new Gubler\ElixirBundle\GublerElixirBundle(),
);
// ...
}
// ...
}
Step 4: Configuration
This bundle supports the following configuration (shown here with the defaults):, (*7)
# Elixir Bundle Config
gubler_elixir:
web_directory: '%kernel.root_dir%/../web'
build_directory: 'build'
url_subdirectoty: ''
web_directory
is the directory on disk where your Symfony project's web
directory is located., (*8)
The build_directory
value is relational to your web_directory. For example, if your build directory is
/{symfony-root}/web/elixir/build/
, you would need to change build_directory
to elixir/build
., (*9)
url_subdirectory
is in case your application is in a subdirectory from your url root. This value should be left empty
if your app is at the root path (ex. https://my-app.com
). If your app is in a subdirectory
(ex. https://my-site.com/app/
), then you need to update this with the subdirectory (for the example, app
). This also
works if your app is multiple subdirectories deep (URL: https://my-site.com/here/is/my/app/
→ setting: here/is/my/app
)., (*10)
Usage
If you use Elixir to version a file, instead of using asset()
in your twig templates like this:, (*11)
<link rel="stylesheet" type="text/css" href="{{ asset('css/app.css') }}" />
you can use elixir()
like this:, (*12)
<link rel="stylesheet" type="text/css" href="{{ elixir('css/app.css') }}" />
TODO
- Add console command to generate base
package.json
file.