The simplest way to include an external javascript file into a Vaadin application is to override the Application#writeAjaxPageHtmlVaadinScripts
method.
To call a javascript function from the Vaadin server-side code, you call Window#executeJavascript
@Override
protected void writeAjaxPageHtmlVaadinScripts(Window window,
String themeName, Application application, BufferedWriter page,
String appUrl, String themeUri, String appId,
HttpServletRequest request) throws ServletException, IOException {
page.write("<script type=\"text/javascript\">\n");
page.write("//<![CDATA[\n");
page.write("document.write(\"<script language='javascript' src='" + appUrl + "/VAADIN/scripts/example.js'><\\/script>\");\n");
page.write("//]]>\n</script>\n");
super.writeAjaxPageHtmlVaadinScripts(window, themeName, application,
page, appUrl, themeUri, appId, request);
}
NB : I have never used Vaadin as a Portlet, but a quick look suggests that this should work OK.
However, this approach is rather rudimentary, and only suitable for a quick hack/proof-of-concept: if you want to so anything more sophisticated, then developing your own Vaadin widget is correct approach. It gives you the power of GWT and JSNI, and gives you a much finer grain of control : See The Book Of Vaadin for more details.