1

Symfony2 プロジェクトでTwitter Bootstrap タブを使用していますが、うまく機能しますが、開発環境でのみ、本番環境では壊れているように見えます (タブを切り替える代わりに、リンクは通常のリンクのように機能し、#de/#en がurl)。

テンプレートで次のマークアップを使用しています。

    <ul class="nav nav-tabs" data-tabs="tabs" id="myTab">
        <li class="active">
            <a data-toggle="tab" href="#de" data-translation-locale="de">Deutsch</a
        </li>
        <li>
            <a data-toggle="tab" href="#en" data-translation-locale="en">English</a
        </li>
    </ul>

    <div class="tab-content">
        <div class="tab-pane active" id="de">
             Deutsch
        </div>
        <div class="tab-pane" id="en">
             English
        </div>
    </div>

Bootstrap .js ファイルは、Asseticを使用して jquery をロードした後にインクルードされます。

    <script src="http://code.jquery.com/jquery-latest.js"></script>
    {% javascripts output="js/frontend.js"
        '%kernel.root_dir%/../vendor/twitter/bootstrap/js/bootstrap-affix.js'
        '%kernel.root_dir%/../vendor/twitter/bootstrap/js/bootstrap-alert.js'
        '%kernel.root_dir%/../vendor/twitter/bootstrap/js/bootstrap-button.js'
        '%kernel.root_dir%/../vendor/twitter/bootstrap/js/bootstrap-carousel.js'
        '%kernel.root_dir%/../vendor/twitter/bootstrap/js/bootstrap-collapse.js'
        '%kernel.root_dir%/../vendor/twitter/bootstrap/js/bootstrap-dropdown.js'
        '%kernel.root_dir%/../vendor/twitter/bootstrap/js/bootstrap-modal.js'
        '%kernel.root_dir%/../vendor/twitter/bootstrap/js/bootstrap-popover.js'
        '%kernel.root_dir%/../vendor/twitter/bootstrap/js/bootstrap-scrollspy.js'
        '%kernel.root_dir%/../vendor/twitter/bootstrap/js/bootstrap-tab.js'
        '%kernel.root_dir%/../vendor/twitter/bootstrap/js/bootstrap-tooltip.js'
        '%kernel.root_dir%/../vendor/twitter/bootstrap/js/bootstrap-transition.js'
        '%kernel.root_dir%/../vendor/twitter/bootstrap/js/bootstrap-typeahead.js'
       %}
    <script src="{{ asset(asset_url) }}"></script>
    {% endjavascripts %}

私の資産構成 (config.yml 内) は次のようになります。

assetic:
 debug: %kernel.debug%
 use_controller: false
 filters:
    cssrewrite: ~
    lessphp:
        file: %kernel.root_dir%/../vendor/leafo/lessphp/lessc.inc.php
        apply_to: "\.less$"

開発環境 (config_dev.yml) では、use_controller オプションが true に設定されています。

assetic:
    use_controller: true

私はassetic:dump web ( --env=prod --no-debug オプションの有無にかかわらず)を使用し、js/frontend.jsが生成されてロードされ、bootstrap-tab.jsがその中にあります(ファイルを開いてチェックしました)が、タブは dev でのみ機能します。何か変更があるかどうかを確認するためだけに、config.yml で use_controller=true を設定しました。

ただし、bootstrap-tab.js をベンダー ディレクトリから /web/js にコピーし、手動で含めることで機能します。

現在、私はウェブサイトから bootstrap.min.js を使用していますが、うまく機能していますが、Assetic を使用して何が間違っていたのかを知りたいです。

4

1 に答える 1

1

トリックを行ったのは次のとおりです。

    {% javascripts output="js/frontend.js"
       ...
    %}
    <script src="{{ asset_url }}"></script>
    {% endjavascripts %}

これをどこから入手したかはわかりませんが、asset(asset_url) が間違っているようです。asset_url だけを使用しても問題ありません。だから私は単に変更しました

    <script src="{{ asset(asset_url) }}"></script>

に

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

最終的なhtmlに違いは見られませんが、うまくいきました。詳細については、Assetic のドキュメントを詳しく調べる必要があります。

于 2012-11-13T10:51:52.037 に答える