Qual è il modo corretto di aggiungere bootstrap a un'app di symfony?

Sto usando symfony framework 3 per sviluppare un'applicazione web. Devo aggiungere la funzionalità di boostrap alla mia applicazione. Ho installato bootstrap usando il comando seguente. (Sto usando il compositore.)Qual è il modo corretto di aggiungere bootstrap a un'app di symfony?

composer require twbs/bootstrap

Installa il bootstrap nella cartella del fornitore dell'applicazione. Più precisamente vendor\twbs\bootstrap.

Devo allegare i file css e js di bootstrap nei modelli di ramoscello dell'applicazione (che si trovano in app\Resources\views) come risorse.

es .:

<link href="{{ asset('css/bootstrap.css') }}" rel="stylesheet" />

Ma attivi funzionano solo con file che si trovano nella (web\bundles\framework) cartella Web. Posso copiare manualmente i file .css e .js dalla cartella del venditore in una cartella Web per fare in modo che funzioni, ma dovrebbe esserci un modo corretto per farlo (ad es .: aggiungere risorse). ad esempio: un comando con bin/console?

Qualsiasi aiuto è apprezzato.

fonte

2016-04-06 Wickramaranga

Symfony migliori Practies dà la risposta a questo problema: http://symfony.com/doc/current/best_practices/web-assets.html

Se si sta sviluppando una domanda come questa, è necessario utilizzare gli strumenti che sono raccomandati dalla tecnologia, come Bower e GruntJS. Dovresti sviluppare l'applicazione frontend separatamente dal tuo backend Symfony (anche separando i repository se lo desideri).

Nel nostro progetto usiamo grunt per costruire e concatenare questi file nella cartella web.

fonte

2016-04-06 13:57:52 fucethebads

Poiché Symfony v2.6 include un nuovo tema modulo progettato per Bootstrap 3oficial documentation

# app/config/config.yml 
twig: 
    form: 
     resources: ['bootstrap_3_layout.html.twig'] 
     # resources: ['bootstrap_3_horizontal_layout.html.twig']

fonte

2016-04-06 14:59:25

È lo stesso vale per sinfonia ** 3 **? – Wickramaranga

Sì, la differenza tra sf3 e sf2.8 (ultimo LTS) è che in symfony 3 non ha le chiamate deprecate che sf2.8 ha. Perché devo reclamare "-1" puntualità? –

Grazie, e non ti ho dato -1. Ho dato +1, ora. :) – Wickramaranga

Sembra che questo non funziona più in Symfony3.

Nel Symfony3 il seguente dovrebbe funzionare:

twig: 
    form_themes: ['bootstrap_3_layout.html.twig']

fonte

2016-04-22 06:13:08 Twoez

Questo assicura che le forme sono create con classi di bootstrap e altri attributi, ma dobbiamo allegare i file di bootstrap da soli. – Wickramaranga

non funziona per me. aggiungi già app/config/config.yml –

Questo funziona in symfony3 –

Da questo link https://coderwall.com/p/cx1ztw/bootstrap-3-in-symfony-2-with-composer-and-no-extra-bundles (e cambiando twitter per twbs) questo è quello che ho nel mio config.yml:

assetic: 
    debug:   '%kernel.debug%' 
    use_controller: '%kernel.debug%' 
    filters: 
     cssrewrite: ~ 
     jsqueeze: ~ 
     scssphp: 
      formatter: 'Leafo\ScssPhp\Formatter\Compressed' 
    assets: 
     jquery: 
      inputs: 
       - %kernel.root_dir%/../vendor/components/jquery/jquery.js 
     bootstrap_js: 
      inputs: 
       - %kernel.root_dir%/../vendor/twbs/bootstrap/dist/js/bootstrap.js 
     bootstrap_css: 
      inputs: 
       - %kernel.root_dir%/../vendor/twbs/bootstrap/dist/css/bootstrap.css 
       - %kernel.root_dir%/../vendor/twbs/bootstrap/dist/css/bootstrap-theme.css 
      filters: [ cssrewrite ] 
     bootstrap_glyphicons_ttf: 
      inputs: 
       - %kernel.root_dir%/../vendor/twbs/bootstrap/dist/fonts/glyphicons-halflings-regular.ttf 
      output: "fonts/glyphicons-halflings-regular.ttf" 
     bootstrap_glyphicons_eot: 
      inputs: 
       - %kernel.root_dir%/../vendor/twbs/bootstrap/dist/fonts/glyphicons-halflings-regular.eot 
      output: "fonts/glyphicons-halflings-regular.eot" 
     bootstrap_glyphicons_svg: 
      inputs: 
       - %kernel.root_dir%/../vendor/twbs/bootstrap/dist/fonts/glyphicons-halflings-regular.svg 
      output: "fonts/glyphicons-halflings-regular.svg" 
     bootstrap_glyphicons_woff: 
      inputs: 
       - %kernel.root_dir%/../vendor/twbs/bootstrap/dist/fonts/glyphicons-halflings-regular.woff 
      output: "fonts/glyphicons-halflings-regular.woff"

Io ho altre dipendenze nel mio composer.json come jsqueeze per esempio, o il processore scss di Leafo, tra jquery e altro.Ho questo nel mio file compositore:

"components/font-awesome": "^4.7", 
    "components/jquery": "^3.1" 
    "leafo/scssphp": "^0.6.7", 
    "patchwork/jsqueeze": "^2.0", 
    "symfony/assetic-bundle": "^2.8", 
    "twbs/bootstrap": "^3.3",

Ho quindi utilizzare in questo modo per il css:

{% stylesheets 
    '@bootstrap_css' 
    'my/other/scss_file1.scss' 
    'my/other/scss_file2.scss' 

    filter='scssphp,cssrewrite' 
    output='css/HelloTrip.css' %} 

    <link href="{{ asset_url }}" type="text/css" rel="stylesheet"/> 

{% endstylesheets %}

e per i JavaScript, posizionare jquery prima:

{% javascripts 
    '@jquery' 
    '@bootstrap_js' 
    'my/other/js_file1.js' 
    'my/other/js_file2.js' 

    filter='?jsqueeze' 
    output='js/HelloTrip.js' %} 

    <script src="{{ asset_url }}"></script> 

{% endjavascripts %}

Ho poi utilizzare bin/console assetic:dump per compilare tutte le mie risorse.

Spero di aiutare!

fonte

2017-03-07 12:18:03

Questa è una grande risposta per Symfony2, ma non è più appropriata per la versione di Symfony 3 a cui la domanda è rivolta. – Aquarion

Come soluzione alternativa, i collegamenti simbolici potrebbero essere creati automaticamente all'aggiornamento dei pacchetti. Per esempio, in composer.json aggiungi nuovo comando in "post-update-cmd":

// ... 
"scripts": { 
     "post-install-cmd": [ 
      "@symfony-scripts" 
     ], 
     "post-update-cmd": [ 
      "@symfony-scripts", 
      "rm web/bootstrap && ln -s -r `pwd`/vendor/twbs/bootstrap/dist/ web/bootstrap" 
     ] 
    },

fonte

2018-03-07 09:40:13 slava

Qual è il modo corretto di aggiungere bootstrap a un'app di symfony?

risposta

Problemi correlati