-ao- ramune blog

©2020 unio / GO2直営からふるラムネ

はじめてのSymfony4 + Vue.js

jsファイルのバージョニング

2018年07月30日
  • PHP
  • Symfony4
  • Vue
チュートリアル対象バージョン

jsファイルのバージョニング

enableVersioning をtrueにすると、webpackで出力したjsファイルにバージョンIDをつけることができます。

webpack.config.js
                
                    Encore
                        .enableVersioning(true)
                        ...
                
            
バージョンID付きでビルドされる

バージョンIDが都度変わるため、jsファイルがブラウザにキャッシュされてしまうという事故を避けることができます。 逆に言えば毎回ファイル名が変わるので、テンプレートなどにファイル名をそのまま指定してる場合は運用が破綻します。 そのため、実際の運用では manifest.json を利用します。

>manifest.json
                
                    {
                      "build/vueapp.js": "/build/vueapp.84f995ba.js"
                    }
                
            

manifest.jsonには、webpackで指定した出力名とバージョニングされたファイルのマッピングが記載されています。 このjsonを config/framework.yaml に設定すると、twigテンプレート上のasset関数が自動で変換してくれるようになります。

config/framework.yaml
                
                    framework:
                        assets:
                            json_manifest_path: '%kernel.project_dir%/public/build/manifest.json'
                
            
templates/tutorial/index.html.twig
                
                    <script src="{{ asset('build/vueapp.js') }}"></script>
                
            
プロフィール画像
なかのひと:unio

数十年前の牧歌的なインターネッツが好きだった、永遠のモラトリアム人。 ただ、モラトリアムしててもお金は増えないので、しゃかいの厳しさを斜め後ろから眺めつつほそぼそと生活しています。

Twitter GitHub
[広告]