Hola me gustaría saber cómo puedo incluir mis CSS y JS en Twig utilizando el microframework Silex. He encontrado varias opciones. Con asset() al parecer solo sirve para Symfony. Carga la plantilla pero no el css ni js.
Esta son las opciones que he probado {{ app.request.basepath }}, src="js/bootstrap.js" y asset(). Ninguna me funciona.
los directorios de mi app son:
/views
index.twig
/css
estilosEvi.css
Agradezco vuestra ayuda.
<!-- Bootstrap -->
{% block stylesheets %}
<link href="{{ app.request.basepath }}/css/bootstrap.css" rel="stylesheet">
<link href="{{ app.request.basepath }}/css/estilosEVI.css" rel="stylesheet" type="text/css">
{% endblock %}
{% block javascripts %}
<script src="js/bootstrap.js"></script>
<script src="js/jquery-1.11.3.min.js"></script>
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="{{ 'https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js'}}"></script>
<script src="{{ 'https://oss.maxcdn.com/respond/1.4.2/respond.min.js'}}"></script>
<![endif]-->
{% endblock %}
Respuestas
Efectivamente la función asset() solo funciona por defecto en Symfony. En Silex tendrías que añadir tu misma esa función tal y como se explica al final de este artículo.
Mi recomendación sería que movieras los archivos CSS al directorio público de la aplicación:
/views
index.twig
...
/web
/css
estilosEvi.css
Y así ya puedes utilizar lo siguiente en tus plantillas:
<link href="{{ app.request.basepath }}/css/bootstrap.css" rel="stylesheet"> <link href="{{ app.request.basepath }}/css/estilosEVI.css" rel="stylesheet" type="text/css">
@javiereguiluz
Corrijo la respuesta de @javiereguiluz por que la actualizacion de Silex a 2.0 ha variado los enlaces
Para Silex 1.3 el enlace correcto es Managing Assets in Templates
Para Silex 2.0 ya esta disponible el Provider Asset
Un saludo
@antoniogarcia78