Giter VIP home page Giter VIP logo

elixir-mix-bundle's Introduction

Build Status Scrutinizer Code Quality

ElixirMixBundle

Note! Starting with Symfony 4 you can use the official webpack wrapper from Symfony: Encore. I also wrote a short blog post about how you can Compile your assets with Symfony Encore.

ElixirMixBundle is a Symfony bundle that integrates Laravel Mix. The purpose of the bundle is to offer the mix() twig function. This is exactly the same mix() function from Laravel blade template system.

Requirements

Before you start installing this bundle you first have to ensure that Node.js and NPM are installed on your machine.

Installation

Step 1: Require the bundle with composer

Open your terminal and run one of the following commands to download the bundle into your vendor directory.

If you have composer installed globally you can run:

$ composer require iulyanp/elixir-mix-bundle

Else you can go with:

$ php composer.phar require iulyanp/elixir-mix-bundle

Step 2: Register the bundle in your AppKernel class

Register the bundle in the app/AppKernel.php file of your project:

<?php
/** app/AppKernel.php */

class AppKernel extends Kernel
{
    public function registerBundles()
    {
        $bundles = array(

            new Iulyanp\ElixirMixBundle\IulyanpElixirMixBundle(),
        );
    }
}

Step 3: Configure the bundle

In order to be able to use the bundle you have to give it some configuration specific to your application.

# config/parameters.yml
parameters:
    # ...
    web_dir: "%kernel.root_dir%/../web"

# config/config.yml
iulyanp_elixir_mix:
    web_dir: "%web_dir%"

The web_dir configuration is just the public path where you want the output for your assets to be saved. I used web directory from Symfony.

Step 4: Initialize larave-mix package

If you already have installed Node.js, npm you should be all set to run:

$ php bin/console mix:init

A base package.json and webpack.mix.js file will be generated into your project root directory.

Then run npm install to install all the dependencies and laravel-mix.

Usage

Now you can use mix() function to version a file like this:

<link rel="stylesheet" type="text/css" href="{{ mix('css/app.css') }}" />

You can find more about laravel mix usage on the official documentation

License

The ElixirMixBundle is open-sourced software licensed under the MIT license.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.