Symfony Encore 多个资产清单答案

【问题标题】：Symfony Encore multiple asset manifestsSymfony Encore 多个资产清单
【发布时间】：2018-10-03 14:26:15
【问题描述】：

我有一个关于 Symfony 3.4 中的 Encore 和资产版本控制的问题。

在我的webpack.config.js我有两种配置。第一个用于 JS 文件，另一个用于编译 .less。

Encore.reset() 重置每个配置

输出包正在通过.enableVersioning 生成带有版本控制的清单，所以我有两个manifest.json in

web/js/manifest.json
web/stylesheets/manifest.json

根据文档，要通过清单加载我的资产，我需要在 config.yml 中声明它

   assets:
        base_path: "%myapp.http.site_assets_suffix%" 
        stylesheets:
            json_manifest_path: "%kernel.project_dir%/web/assets/stylesheets/manifest.json"

如果我想链接到webpack生成的style.css，我使用

asset("stylesheets/style.css")

但在我的应用程序中，我有两个清单，我认为由于两个 Encore 配置，这无法更改。

我尝试过添加类似的东西

packages:
     stylesheets:
                json_manifest_path: "%kernel.project_dir%/web/assets/stylesheets/manifest.json"
     js:
                json_manifest_path: "%kernel.project_dir%/web/assets/js/manifest.json"

因为我在某个地方看到过，但不幸的是，这根本行不通。

我曾考虑在最后一个 webpack 入口点将两个清单合并为一个，但这可能很耗时。

除了结合manfiests或将js + less编译组合成一个大的Encore任务之外，还有其他解决方案吗？

【问题讨论】：

你能分享你的 webpack.config.js 吗？
@svantetic 你解决了吗？如果您这样做了，请分享您的解决方案以回馈社区。span>
@YahyaE 添加了答案

标签： symfony webpack manifest versioning

【解决方案1】：

我找到了解决办法

assets:
    base_path: 'path%'
    packages:
        noversion:
            version: false
            version_format: "%%1$s"
            base_path: "path%"
        stylesheets:
            json_manifest_path: "%kernel.project_dir%/web/assets/stylesheets/manifest.json"
        js:
            json_manifest_path: "%kernel.project_dir%/web/assets/js/manifest.json"
        admin:
            json_manifest_path: "%kernel.project_dir%/web/assets/js/admin/manifest.json"

然后在.twig文件中，你需要调用它为

    <script src="{{ asset('assets/DIRNAME/WEBPACK_ENTRY_NAME_HERE', ASSET_PACKAGE_NAME_HERE) }}"></script>

就我而言

<script src="{{ asset('assets/js/backend.js', 'js') }}"></script>

在我的例子中，WEBPACK_ENTRY_NAME 是来自webpack.config.js 的 Webpack/Encore 包的名称

.setOutputPath('./web/assets/js')
    .setPublicPath('/assets/js')
    .addEntry('backend',

抱歉，回复晚了，我忘记了。

【讨论】：

【解决方案2】：

Webpack Encore 使用webpack-manifest-plugin 生成manifest.json 文件。

根据文档，您可以在设置配置时指定options.seed。

用于播种清单的键/值对缓存。这可能包括一组要包含在清单中的自定义键/值对，或者可用于在多编译器模式下跨编译组合清单。要组合清单，请将共享种子对象传递给每个编译器的 ManifestPlugin 实例。

 Encore.configureManifestPlugin(options => {
            let seed;

            try {
                // require your existing manifest content if exists
                seed = require(path.join(outputPath, 'manifest.json'));
            }

            catch (e) {
                // fallback if manifest.json is missing
                seed = {};
            }

            // inject your latest config as seed.
            // The plugin will update it and rewrite manifest.json with correct values (overwrite existing keys, append news)
            options.seed = seed;

           // Also i add a trick to avoid "License.txt" entries
            options.generate = function(seed, files, entrypoints) {
                // trick to avoid generate useless versionned entries like License
                const filesWithoutLicense = files.filter(file => {
                    return file.path.match(/.*LICENSE.*/) === null;
                });

                const newManifestContent = filesWithoutLicense.reduce(
                    (newManifestContent, file) => {
                        newManifestContent[file.name] = file.path;
                        return newManifestContent;
                    },

                    seed
                );


                return newManifestContent;
            }

【讨论】：