Volto 17 breaks many addons?

Development Plone 6 UI (Volto)
1

It looks like many Volto addons are broken in Volto 17, with build error messages like:

Should not import the named export 'version' (imported as 'voltoVersion') from default-exporting module (only default export is available soon)

(Maybe this is related to dropping Node.js 14 and 16 support?)

I noticed this when trying to rebuild my instance with Volto 17 by including my addons in a new cookiecutter layout, and when that failed building with the vanilla cookiecutter with only eea/volto-eea-kitkat (github.com). Paring it down further revealed that this is a widespread problem.

I have a bunch of questions about this:

  1. Am I doing something wrong?
  2. Was there some kind of warning about this? Is there something I should be watching to avoid being surprised and undermined by it? I spent a lot of time just figuring out that upgrading wouldn't work.
  3. Is there some plan to recover so sites that depend on several (arguably essential) addons aren't unable to upgrade?
  4. Is there some plan to reduce disruption in the future?
  5. In general, what is someone who is dependent on numerous addons supposed to do?
2

We are at PloneConf 2023 and I don't think that we had the time to look at this post but in case you don't get a response since I work with volto-eea-kitkat I will try on Monday with Volto 17 and see if I can reproduce the issue.

3

Ah, I should have realized! That could explain why I'm the only one reporting the problem. Thanks much for taking the time to send a note, and I'll be interested to hear what you find when you can check.

4

Just thinking out loud, In volto 17 after the typescript support there is a change in how we import modules, even in our js code. Instead of import {package} from 'package-js' it should be import {default as package} from 'package-js' where "package" is default exported

I think normal import should also work if you have allowSyntheticDefaultImports: true in tsconfig.json :thinking:.

5

This is a consequence of the upgrade to Webpack 5 in Volto 17. Webpack 5 no longer supports named imports from JSON files (because it is following a change in some spec). So it's no longer allowed to do import { version } from './package.json', you have to do import packageJson from ./package.json` and then look up the name after it is imported.

Volto itself was updated to handle this in Node 18 and webpack 5 support (#4086) · plone/volto@b780de6 · GitHub

I see that volto-eea-kitkat has a shadow for the VersionOverview.jsx component, which needs to be updated with the same fix. I doubt it affects volto addons in general, just anywhere that does the kind of named import from a JSON file that is no longer supported by webpack.

This is mentioned in the webpack 5 migration guide: https://github.com/webpack/changelog-v5/blob/master/MIGRATION%20GUIDE.md#cleanup-code -- if you maintain a volto addon and want to support Volto 17, you may want to look at that document to see if there are other necessary changes.

6

Thanks for your attention to this!

That appears to be the current setting in my frontend instance tsconfig.json, with the problem happening. Might it need to be set elsewhere, like in the addon?

7

Did you have an opportunity to check into this?

8

@klm as @nileshgulia1 and @davisagli have mentioned there are some upgrade steps that needs to be performed when upgrading to Volto 17.
volto-eea-kitkat is a collection of several addons from the EEA organization with various levels of compliancy for Volto 17.
We have only today added a ticket regarding the upgrade to Volto 17 so for now I don't recommend you try Volto 17 with volto-eea-kitkat.
I've noticed your issue added to GitHub, Volto 17.0.1 site instance fails to compile with kitkat · Issue #134 · eea/volto-eea-kitkat · GitHub
if you find any other debug or breaking messages feel free to add it as other comments to that issue.

Unfortunately I don't have a timeframe for when this will be fixed for our add-on, but keep an eye on this issue for comments as we will add any feedback when we progress with volto-eea-kitkat being compatible with Volto 17

9

Thanks, David. I can wait but it's helpful to know that this is recognized and being considered. I have no urgent need to upgrade yet, but fully expect it will eventually be a problem to be unable to upgrade. (I did take the step of trying to use selected addon constituents of volto-eea-kitkat and hit problems, so established that the remedy is deeper than just updating the kitkat container.)

I did mention other questions about policies for mitigating such occurrences in the future. Maybe it's still early in Volto's development and some churn is unavoidable for now. But eventually some agreements about systematically introducing addon-breaking changes will serve everyone who wants to have a sustainable Volto ecosystem. I like Volto and am depending on it, want to see it succeed.

10

I don't think the issue is that bad, the addons that would break are the ones that are using features that require changes after moving to newer versions of our underlying technologies.
For instance I just had a look with @avoinea and the KitKat error is due to changes in webpack 5 imports of json which you can see an issue here Webpack5 JSON module import with Object destructuring assignment should drop unused JSON properties · Issue #11676 · webpack/webpack · GitHub
The fix is simple actually and we will have a commit soon in the develop branch.

In every technology once you reach a major release is when you introduce breaking changes and you have to look at the upgrade guide to see what needs to be changed for the packages to work.

In our case it wasn't Volto that broke the add-on but how we with eea-kitkat used json imports which changed in Webpack 5, so yeah don't panic, check the docs and google search and code on :slight_smile:

11

Volto EEA Kitkat 19.0.0 released Releases · eea/volto-eea-kitkat · GitHub and it should also work with Volto 17 / Webpack 5

3 Likes
12

Thanks, all! It works fine now.

1 Like