I don't know if this fits here, but I have a probl...

# javascript

[Hildebrandt Tobias]

I don't know if this fits here, but I have a problem that I cannot find the solution for.
We have a legacy KotlinJS frontend (0.0.45) that is already getting replaced bit by bit.
But it still needs to get some updates from time to time.
It used to build just fine, but a few weeks ago it stopped working from one day to the next with no changes.
Now I get this error in the pipeline (IDE works fine):

Starting process 'command '/root/.gradle/nodejs/node-v16.20.2-linux-x64/bin/node''. Working directory: /opt/atlassian/pipelines/agent/build/build/js/packages/frontend Command: /root/.gradle/nodejs/node-v16.20.2-linux-x64/bin/node /opt/atlassian/pipelines/agent/build/build/js/node_modules/webpack/bin/webpack.js --config /opt/atlassian/pipelines/agent/build/build/js/packages/frontend/webpack.config.js
Successfully started process 'command '/root/.gradle/nodejs/node-v16.20.2-linux-x64/bin/node''
Module parse failed: Unexpected token (26:24)
File was processed with these loaders:
 * ../../node_modules/source-map-loader/dist/cjs.js
You may need an additional loader to handle the result of these loaders.
|         const foundScript = document.querySelector(`script[src="${src}"]`);
|         // Call onLoad if script marked as loaded.
>         if (foundScript?.dataset.loaded) {
|             onLoad();
|             return;

I already tried to edit the webpack.config.js with

config.module.rules[0] = {
    test: /\.js$/,
    enforce: 'pre',
    exclude: '/node_modules/',
    use: ['source-map-loader'],
};

But it doesn't help.
I know it's all old stuff, but we'd just need it to work for a few months again.
Does anyone have an idea?

[Artem Kobzar]

Do yo have a reproducer, that it didn't work with some version and after the new one it has started to fail?
Can you share the reproducer? (If you can minify it, it would be perfect)

[turansky]

I had similar problem with latest Webpack update.
Pill:
1. Remove package-lock.json
2. ./gradlew clean
3. Build
4. PROFIT

[Artem Kobzar]

@Ilya Goncharov [JB] ^^

[Hildebrandt Tobias]

Thank you Victor I will try this first thing tomorrow. The build pipeline is always copied fresh though, I don't know if it will help.
@Artem Kobzar I don't really know what you mean (by reproducer).
I have older pipelines histories that worked. And when I restart those pipelines or start new ones on the exact same git revision it still fails even though the sources should be identical.
So there is no new version. The exact same code just started to not build anymore in the pipeline (bitbucket) from one day to the next. Building locally is fine. So I guess I might have to transfer my locally compiled version. It would be a drag, but it's just for a few times.
It's Gradle 7.5.1 and Node 16.20.2

[turansky]

Building locally is fine.

If it's fine after cleanup, then cleanup on CI should fix problem

[Hildebrandt Tobias]

I changed the pipeline to:

- ./gradlew clean
- ./gradlew -Pversion=${version} --no-daemon --console plain -i frontend:build

Sadly the error persists.

[Ilya Goncharov [JB]]

Hi, probably used version of webpack could not process JS feature named "optional chaining" (foo?.bar)
Don't you use Kotlin Gradle plugin with enabled webpack feature (and which version of Kotlin Gradle plugin do you use?)
Do you use frontend plugin?
Do you consider option with migration to relatively new version of Kotlin?

[Hildebrandt Tobias]

Okay, so with Ilya's comment in mind I updated the webpack version to 5.73
which in turn had me set the webpack-cli version to 5.1.4
which in turn had me add npm browserify
which needed additional webpack.js configuration with:

config.resolve.fallback = {
    "os": require.resolve("os-browserify/browser"),
    "path": require.resolve("path-browserify")
};

Buuuut now it seems to work. Thank you!

[Ilya Goncharov [JB]]

So, thats why I asked you about possibility of upgrade onto new KGP, because it already includes all necessary changes for webpack 5 🙂

[Hildebrandt Tobias]

The problem with that old project is that many dependencies are at versions where any update
would result in breaking changes. It's Kotlin 1.6.10 (because 6.20 breaks wire), it's muirwik MUI,
old ktor (really nasty breaking changes there), old exposed, old react, old kotlin frontend, etc.
But the new one where everything is at the latest versions is already in PROD at covering 80%
of the functionality, so I try to put as little ressources as possible into the old one.

And by old I mean kotlin-forntend-plugin 0.0.45 levels of old.