Vaadin 23.3.2 Difference in compilation using 'production' goal

Hi,
seems that there is some difference, will draw one case from few (those encounter during migration from 14):

import * as moment from ‘moment’;
window.MyApp.Components.SomeWidget= function() {
return new function(){
var methods = {
init:function(){ return moment().format(‘L’); }
}
return {
init : methods.init
}
}
this simple usecase have the difference. while moment is available and work fine on dev mode, the ‘production’ build solution end with error on runtime that moment is not a function…

Any idea what cause the difference?

Assuming you’re using Maven, what does your production profile look like?

And are you using Vite or Webpack?

Hi @astonishing-kookaburra . well, i am using Vite (at least trying)
this is my profile:


production

<vaadin.productionMode>true</vaadin.productionMode>

        <dependencies>
            <dependency>
                <groupId>com.vaadin</groupId>
                <artifactId>flow-server-production-mode</artifactId>
            </dependency>
            <dependency>
                <groupId>com.vaadin</groupId>
                <artifactId>vaadin-core</artifactId>
                <exclusions>
                    <exclusion>
                        <groupId>com.vaadin</groupId>
                        <artifactId>vaadin-dev-server</artifactId>
                    </exclusion>
                </exclusions>
            </dependency>
        </dependencies> 

        <build>
            <plugins>
                <plugin>
                    <groupId>com.vaadin</groupId>
                    <artifactId>vaadin-maven-plugin</artifactId>
                    <version>${vaadin.version}</version>
                    <executions>
                        <execution>
                            <goals>
                                <!-- <goal>clean-frontend</goal> -->
                                <goal>build-frontend</goal>
                            </goals>
                            <phase>compile</phase>
                        </execution>
                    </executions>
                    <configuration>
                        <productionMode>true</productionMode>
                    </configuration>
                </plugin>
            </plugins>
        </build>
    </profile>

Maybe it can hint the root cause, will draw one more simply case.
@Override
public void configurePage(AppShellSettings settings) {
settings.addFavIcon(“icon”, “/frontend/images/coresuite_fav_icon.png”, “32x32”);
}
work perfect, until build for production. the error in browser is that image not exist…
not sure how it can while all images in same place and does exist on other place of app

this is a real blockers. i will have to go back to webpack :(.

Maybe you can create a sample project with the reproducible issue. and create a ticket on github.

As far as I know, favicons can’t be accessed like this. If you use spring boot - change the path and remove “frontend” from it and move it to one of the public accessible static folders from spring boot like “public/images” within resources. It works in dev and prod flawlessly.

Check that import path

frontend is under META-INF/resources which is a static folder of spring boot ootb.

I would suggest to change it like described above if you want quick wins :wink:

:slightly_smiling_face: let go for it. thanks

Thanks @Tatu for this useful link