Webpack Encore generates the right assets but with an empty Entrypoints.json

Question

this is probably more a theoretical Question, so I'll just write my thoughts down... I am replacing assetic with webpack_encore in our symfony 3.4 application. Local works everything fine but when i am deploying it to our test environment via Jenkins it generates all the assets nicely but the Entrypoints.json is not stuffed with the entrypoints informations but with a single (not existing) file. Jenkins, Composer Install, NPM BUILD etc. nothing fails everything looks just fine...

I am working with:

"symfony/symfony": "3.4.*",
"symfony/webpack-encore-bundle": "^1.4",
"@symfony/webpack-encore": "^0.26.0";
Jenkins ver. 2.167

Things I have done and checked:

webpack_encore output path is set in the symfony configs as well as the webpack.config.js;
Permissions are set to read/write the files (they get newly generated with each build)
tried on a different environment (same problem, no entrypoints in the .json)
tried to reproduce lokal (didn't got it done)
tried another node version (8.x)

So this is how the Entrypoints.json looks like:

{
  "entrypoints": {
    "main": {
      "js": [
        "/assets/main.d062ba67.js"
      ]
    }
  }
}

and here is a list of the generated files:

-rw-r--r-- 1 deploy deploy 1188442 Apr  4 16:03 0.2d854ee0.js
-rw-r--r-- 1 deploy deploy   13270 Apr  4 16:03 0.e9d891b2.css
-rw-r--r-- 1 deploy deploy     103 Apr  4 16:03 entrypoints.json
drwxr-xr-x 2 deploy deploy    4096 Jan 21 11:04 fonts
drwxr-xr-x 2 deploy deploy    4096 Jan 21 11:04 images
-rw-r--r-- 1 deploy deploy      50 Apr  4 16:03 manifest.json
-rw-r--r-- 1 deploy deploy  273060 Apr  4 16:03 mijn.51e8a5cf.css
-rw-r--r-- 1 deploy deploy  399784 Apr  4 16:03 mijn.b4e892a5.js
-rw-r--r-- 1 deploy deploy     155 Apr  4 16:03 mijn_servicecentre.8ad08279.js
-rw-r--r-- 1 deploy deploy    8867 Apr  4 16:03 mijn_servicecentre.aed8de72.css
-rw-r--r-- 1 deploy deploy  131539 Apr  4 16:03 mijn_translations.6510f7fd.js
-rw-r--r-- 1 deploy deploy    1463 Apr  4 16:03 runtime.3dee20dd.js

EDIT:: Finally the webpack.config.js

/* global __dirname */
let Encore = require("@symfony/webpack-encore");
const path = require("path");

Encore
// output path
    .setOutputPath("web/assets")
    .enableVersioning()

    // relative path in the browser
    .setPublicPath("/assets")

    // will create web/assets/mijn.js and web/assets/mijn.css && serviceCenter
    // which is than included in base.html.twig and respective...
    .addEntry("mijn", "./app/Resources/frontend/encore_mijn.js")
    .addEntry("mijn_servicecentre", "./app/Resources/frontend/encore_mijn_servicecentre.js")

    // enable sass-compilation
    .enableSassLoader(function (sassOptions) {
        sassOptions.includePaths = [
            "node_modules/bootstrap-sass/assets/stylesheets",
            "node_modules/bootstrap-datepicker/dist/css",
            "node_modules/bootstrap-select/sass",
            "node_modules/xs4-icons/dist/"
        ];
    }, {
        resolveUrlLoader: true
    })

    //expose jquery
    .addLoader({
        test: require.resolve("jquery"),
        use: [{
            loader: "expose-loader",
            options: "jQuery"
        }, {
            loader: "expose-loader",
            options: "$"
        }, {
            loader: "expose-loader",
            options: "Snow"
        }]
    })

    .addLoader({
        test: require.resolve("bazinga-translator"),
        use: [{
            loader: "expose-loader",
            options: "Translator"
        }],
    })

    .addLoader({
        loader: "webpack-modernizr-loader",
        test: /\.modernizrrc\.js$/
    })

    .addAliases({
        modernizr$: path.resolve(__dirname, "./.modernizrrc.js")
    })

    //enable compilation of vue-components
    .enableVueLoader()

    //enable sourcemaps for development reasons only
    .enableSourceMaps(!Encore.isProduction())

    // enable postcss loader for autoprefixing
    .enablePostCssLoader()

    // empty the outputPath dir before each build
    .cleanupOutputBeforeBuild()

    .enableSingleRuntimeChunk()

    .enableSingleRuntimeChunk()

    .splitEntryChunks()
;

// isProduction because we get in dev-mode real-time translation
// out of _translations.html.twig and the bazinga vendor plugin
if (Encore.isProduction()) {
    Encore.addEntry("mijn_translations", "./app/Resources/frontend/encore_translations.js")
}

// export the final configuration
module.exports = Encore.getWebpackConfig();

Does somebody have a thought on how it can be that the entrypoints files are getting generated just fine but the Entrypoints.json is not filled with that?

EDIT 2::

I run through al my commits again and it looks like since I upgraded the npm package: webpack-encore from 0.20.1 to 0.21 which requires babel7 its breaking...

tchap tchap · Accepted Answer · 2019-04-05T10:24:27

Apart from your double .enableSingleRuntimeChunk() line which is just a typo (but you never know, that might be the culprit), I think that you want to look at the manifest.json file instead to have the matches between your actual files and the entrypoints.

I don't know exactly what you are trying to achieve with the entrypoints.json file but as stof said : "You should still use the manifest.json to find the versionned path for each of them" (in https://github.com/symfony/webpack-encore/issues/355)

Webpack Encore generates the right assets but with an empty Entrypoints.json

1 Answers