\u0000Hi All,\n\nI’ve in the process of migrating to version 14 from 13. I’m trying the migrate-to-p3 maven goal to convert my bower components to polymer 3.\n(Though the components are really just custom styles… )\n(e.g.)\n\n<dom-module id=\"lumo-tab\" theme-for=\"vaadin-tab\">\n <template>\n <style>\n\t\t...\n </style>\n </template>\n</dom-module>\n\n(I did it that way to I could include the styles at the component level, instead of in the main UI/View.)\n(Should I just now move it into the styles folder…)\n\nI get this error…\n\n\n[1/2] \uD83C\uDF00 Converting Package...\nOut directory: /Users/stuart/eclipse-workspace/HaloCRM/target/migration\nUnhandled Rejection at: Promise Promise {\n <rejected> TypeError: url.replace is not a function\n at Object.replaceHtmlExtensionIfFound (/Users/stuart/eclipse-workspace/HaloCRM/target/migration/node_modules/polymer-modulizer/src/urls/util.ts:32:14)\n at Object.generatePackageJson (/Users/stuart/eclipse-workspace/HaloCRM/target/migration/node_modules/polymer-modulizer/src/package-manifest.ts:205:24)\n at Object.<anonymous> (/Users/stuart/eclipse-workspace/HaloCRM/target/migration/node_modules/polymer-modulizer/src/convert-package.ts:133:23)\n at Generator.next (<anonymous>)\n at fulfilled (/Users/stuart/eclipse-workspace/HaloCRM/target/migration/node_modules/polymer-modulizer/lib/convert-package.js:17:58) } reason: TypeError: url.replace is not a function\n at Object.replaceHtmlExtensionIfFound (/Users/stuart/eclipse-workspace/HaloCRM/target/migration/node_modules/polymer-modulizer/src/urls/util.ts:32:14)\n at Object.generatePackageJson (/Users/stuart/eclipse-workspace/HaloCRM/target/migration/node_modules/polymer-modulizer/src/package-manifest.ts:205:24)\n at Object.<anonymous> (/Users/stuart/eclipse-workspace/HaloCRM/target/migration/node_modules/polymer-modulizer/src/convert-package.ts:133:23)\n at Generator.next (<anonymous>)\n at fulfilled (/Users/stuart/eclipse-workspace/HaloCRM/target/migration/node_modules/polymer-modulizer/lib/convert-package.js:17:58)\n[DEBUG] Modulizer has completed successfully\n[DEBUG] Use [/Users/stuart/eclipse-workspace/HaloCRM/target/migration] as source folders to copy\n[DEBUG] Copy resources from /Users/stuart/eclipse-workspace/HaloCRM/target/migration to /Users/stuart/eclipse-workspace/HaloCRM/frontend\n[DEBUG] Directory/file /Users/stuart/eclipse-workspace/HaloCRM/frontend already exists, skipping its creation\n[DEBUG] Directory/file /Users/stuart/eclipse-workspace/HaloCRM/frontend/js already exists, skipping its creation\n[DEBUG] Writing content to '/Users/stuart/eclipse-workspace/HaloCRM/frontend/bower.json'\n[DEBUG] Directory/file /Users/stuart/eclipse-workspace/HaloCRM/frontend/styles already exists, skipping its creation\n[DEBUG] Directory/file /Users/stuart/eclipse-workspace/HaloCRM/frontend/styles/images already exists, skipping its creation\n[DEBUG] Directory/file /Users/stuart/eclipse-workspace/HaloCRM/frontend/styles/images/icons already exists, skipping its creation\n[DEBUG] Writing content to '/Users/stuart/eclipse-workspace/HaloCRM/frontend/.gitignore'\n[DEBUG] Writing content to '/Users/stuart/eclipse-workspace/HaloCRM/frontend/package-lock.json'\n[DEBUG] Writing content to '/Users/stuart/eclipse-workspace/HaloCRM/frontend/package.json'\n[DEBUG] Directory/file /Users/stuart/eclipse-workspace/HaloCRM/frontend/src already exists, skipping its creation\n[WARNING] Don't know how to resolve Html import 'bower_components/iron-pages/iron-pages.html'\n[WARNING] Don't know how to resolve Html import 'bower_components/halo-full-calendar/calendar.html'\n[WARNING] Don't know how to resolve Html import 'bower_components/grid-provider/grid.html'\n[WARNING] Don't know how to resolve Html import 'bower_components/tabs/tabs.html'\n[WARNING] Don't know how to resolve Html import 'bower_components/paper-swatch-picker/paper-swatch-picker.html'\n[WARNING] Don't know how to resolve Html import 'bower_components/paper-swatch-picker/paper-swatch-picker.html'\n[INFO] ------------------------------------------------------------------------\n[INFO] BUILD SUCCESS\n[INFO] ------------------------------------------------------------------------\n[INFO] Total time: 36.470 s\n[INFO] Finished at: 2019-08-13T10:42:46+01:00\n[INFO] ------------------------------------------------------------------------\n\n\nIs the url.replace error stopping the tool resolving the html imports? And how do I fix it? \n\n\nStuart
Ok, I moved the .html files containing the custom-styles to the resources/frontend/styles directory and re-ran the migrate-to-p3.
The new .js files were created in [project]
/frontend/styles, which is great. However the @HtmlImport’s were changed to @JsModule’s but with the wrong path. My tabs.js was imported as @JsModule(“/tabs/tabs.js”). (the build complained…)
So I changed the JsModules to ./styles/<name.js> i.e, @JsModule(“./styles/tabs.js”). The build no longer complains, but the CSS doesn’t seem to be having any effect. (Simple case, I change the font in --lumo-font-family.)
Any other things I can check? everything builds fine, its just a case of the theme customisations (css) not pulling through.
Stuart.
Hi.
For the themes I would almost suggest to change them by hand to css files see [Theming Web Components]
(https://vaadin.com/docs/v14/flow/theme/theming-crash-course.html) documentation as this makes it easier to
handle in the future.
The migrator only changes what is in the HtmlAnnotation and doesn’t link the regenerated style if it was in another folder.
The Warning given for Don't know how to resolve Html import 'bower_components/...' is just that when
changing it to a JsModule we couldn’t come up with what npm package vendor.
For instance for bower_components/paper-swatch-picker/paper-swatch-picker.html the correct should be
@polymer/paper-swatch-picker/paper-swatch-picker.js, but the migration tool doesn’t at the moment know any
other vendors apart from vaadin which it can fill automatically with @vaadin/vaadin-
This should be made more explicit on what it tries to do (see [6208]
(https://github.com/vaadin/flow/issues/6208)).
In this case (if the component is [tabs]
(https://www.npmjs.com/package/tabs)) the bower_components/tabs/tabs.html webcomponent should probably change to @JsModule("tabs/tabs.js")
- Mikael
Could you please tell me how to run the migration tool? What is the mvn command?
Do I need to update anything before running the tool in my v13 project?
Thanks!
@Mikael, yes I saw that I could use @CssImport. I tried, but could not get the css styles to pull through. After changing file names, locations etc. I gave up and reverted to a backup 
I’ll try again today without using the migration tool.
@Sajid, you just need to add a Maven run configuration with the goal vaadin:migrate-to-p3
Stuart.
Well, good news
I manually migrated the styles using @CssImport and everything is working great.
(Ok, this time I didn’t need to plumb in node and npm etc, but even so everything went quickly.)
(The FullCalendar component isn’t ready for 14 yet and I’m swapping out the paper-swatch-picker anyway. )
Stuart.
Hi all.
I get the same error during “Converting package”.
My html files are not changed after migration tool process except the body balise wich has been added. All files under /src remains unchanged also.
My project is running on vaadin 13 using spring boot so my frontend files are located under src/main/resources/META-INF but I tried to put the folder under src/main/webapp or src/main/resources without more success.
Any ideas ?
Thank you in advance,
Best regards
When I put all html files directly under src/main/webapp/frontend/ it works. My html templates are migrated to js file.
Nevertheless it doesn’t work when I keep my folder hierarchy for instance src/main/webapp/frontend/styles/sharedstyles.html or src/main/webapp/frontend/views/login/login-view.html.
In both cases java class declarations annotated with @HtmlImport and @StyleSheet in the project source files are not rewrited into @JsModule annotations.
Best regards
Hi Lucien.
For Spring projects we have the [6207]
(https://github.com/vaadin/flow/issues/6207) that will make the default folder handling better and also adds the default Spring project frontend folder places to be automatically checked and handled.
Not certain why the folder hierarchy makes the tranformation fail.
There are already some fixes to the migrator incomming next week, but can be tested already using the command mvn com.vaadin:flow-maven-plugin:2.0.8:migrate-to-p3
- Mikael
Hi @Mikael.
I’m lost, because i tried a lot of ways to migrate from p2 to p3, but i not get it. My project is spring boot, and this is my project structure.
More specifications, my OS is Windows 10.
- mvn clean
- mvn package -DskipTests
- mvn vaadin:migrate-to-p3 -DkeepOriginal=true
But when execute mvn vaadin:migrate-to-p3 fails with this information.
Anyone can help me
Hello, I have got now the same error, is there any solution to fix this problem, I’m using the command:
mvn com.vaadin:flow-maven-plugin:2.1.5:migrate-to-p3 -DkeepOriginal=true