How to use twitter bootstrap using assetic and less in symfony2?
Finally I've used simply js and css files from bootstrap, without any bundle in symfony because it's faster, easier and may have some advantages such as any update of bootstrap will not crash my site (see update bootstrap 2 to 3...).
So thanks to all for your answers but this is for me best solution.
zelazowy
PHP programmer interested in new technologies, code optimization and self-development.
Updated on June 17, 2022Comments
-
zelazowy almost 2 years
I can't get twitter bootstrap working. I know there is many tutorials and so on, but none of it works for me...
My composer.json is:
"require": [...] "leafo/lessphp": "dev-master", "braincrafted/bootstrap-bundle": "dev-master", "twbs/bootstrap": "2.3.*"
My assetic configuration is:
# Assetic Configuration assetic: filters: lessphp: file: %kernel.root_dir%/../vendor/leafo/lessphp/lessc.inc.php apply_to: "\.less$" cssrewrite: ~ assets: bootstrap_css: inputs: - %kernel.root_dir%/../vendor/twbs/bootstrap/less/bootstrap.less - %kernel.root_dir%/../vendor/twbs/bootstrap/less/responsive.less filters: - lessphp - cssrewrite output: css/bootstrap.css bootstrap_js: inputs: - %kernel.root_dir%/../vendor/twbs/bootstrap/js/bootstrap-transition.js - %kernel.root_dir%/../vendor/twbs/bootstrap/js/bootstrap-alert.js - %kernel.root_dir%/../vendor/twbs/bootstrap/js/bootstrap-button.js - %kernel.root_dir%/../vendor/twbs/bootstrap/js/bootstrap-carousel.js - %kernel.root_dir%/../vendor/twbs/bootstrap/js/bootstrap-collapse.js - %kernel.root_dir%/../vendor/twbs/bootstrap/js/bootstrap-dropdown.js - %kernel.root_dir%/../vendor/twbs/bootstrap/js/bootstrap-modal.js - %kernel.root_dir%/../vendor/twbs/bootstrap/js/bootstrap-tooltip.js - %kernel.root_dir%/../vendor/twbs/bootstrap/js/bootstrap-popover.js - %kernel.root_dir%/../vendor/twbs/bootstrap/js/bootstrap-scrollspy.js - %kernel.root_dir%/../vendor/twbs/bootstrap/js/bootstrap-tab.js - %kernel.root_dir%/../vendor/twbs/bootstrap/js/bootstrap-typeahead.js - %kernel.root_dir%/../vendor/twbs/bootstrap/js/bootstrap-affix.js output: js/bootstrap.js
And finally
::base.html.twig
:{% block stylesheets %} <link rel="stylesheet" href="{{ asset('css/bootstrap.css') }}"> {% endblock %} {% block javascripts %} <script src="{{ asset('js/bootstrap.js') }}"></script> {% endblock %}
I'm trying include js ans css with different ways, for example:
{% stylesheets '%kernel.root_dir%/../vendor/twbs/bootstrap/less/bootstrap.less' %} <link rel="stylesheet" href="{{ asset_url }}" /> {% endstylesheets %}
or
{% stylesheets '@bootstrap_css' %} <link rel="stylesheet" href="{{ asset_url }}" /> {% endstylesheets %}
but it still not working and I'm getting 404 errors for bootstrap.css and bootstrap.js.
Whats wrong with my config? I'm using wamp server on windows 7 64bit.
The only way to get it working was to use cli command
assetic:dump
but I think it's not correct way to do this on dev environment.