Set filename output for webpack

How can I set the output filename in webpack? Sometimes the transpiled filename changes. I'am using sc.recipe.staticresources and output has a filename like cover-89d3ed4.css and cover-89d3ed4.js I need fix to use in manifest theme.

Sometimes the transpiled filename changes.

Actually, the filename always changes. The idea here is to version your index.html and static resources only in webpack folder and, specially when releasing your package (or using a watch mecanism while developing), you run the transpiler which will do all this work. In a nutshell:

  • All static is kept in webpack folder;
  • You run a command to create the static resources with the hash in the filename in the folder of your theme package (bin/build-<short_name-staticresources-name>);
  • The index.html file which was in webpack folder will be created in the theme package with the correct hash references of the static files.

Although in portuguese, you can check exactly this in action in GitHub - plonegovbr/brasil.gov.temas at 2.0.3. Check brasil.gov.temas/buildout.cfg at 2.0.3 · plonegovbr/brasil.gov.temas · GitHub for <short_name-staticresources-name> and the webpack configuration files and how the final distribution is created in brasil.gov.temas · PyPI. The watch mecanism is explained there as well.

Another approach with sc.recipe.staticresources is using a viewlet in IHtmlHead that will create a resources.pt file with the correct hashes. Check collective.upload/src/collective/upload/browser/static at master · collective/collective.upload · GitHub (actually the PR Update static resources by rodfersou · Pull Request #105 · collective/collective.upload · GitHub) to get some ideas about this approach.

1 Like