Ask Questions and Find Answers
Important:
Ask is now read-only. You can review any existing questions and answers, but not add anything new.
But - don't panic! While ask is no more, we've replaced it with discuss - the new Liferay Discussion Forum! Read more here here or just visit the site here:
discuss.liferay.com
RE: Liferay Vue Module Project: Import of Single file templates is not work
I've created a module project with npm-vue-module template. "Hello World" is running so far but always when I try to import a Single File Template (App.vue) an error occurs.
import Vue from 'vue/dist/vue.common';<br> import App from './App.vue'
export default function(elementId) {<br> new Vue({<br>
el: `#${elementId}`,<br> data: {<br>
text: 'Hello World!',<br> },<br> });<br> }
ERROR [http-nio-8080-exec-7][status_jsp:927] Path [Vueport3@1.0.0/App.vue.js] does not start with a "/" character
It seems that vue file is taken as javascript file without any conversion.
In the browser its shown as loading failed: http://localhost:8080/combo/?browserId=firefox&minifierType=&languageId=en_US&b=7100&t=1546459208026&Vueport3@1.0.0/App.vue.js
I am using LR 7.1 Bundle.
Any ideas?
You are right. As stated here all modules inside the deployed JAR file must be JS code in AMD format, so you need to make sure that you translate your vue templates to JS code as it is done, for instance, with JSX templates in React projects.
I guess you can use babel for that, but I cannot be 100% sure because I haven't tested it.
I 've heard that there will be a new version of liferay-npm-bundler for vue/react/etc. Will the conversion of *.vue files to javascript be considered in the new version of liferay-npm-bundler?
Unfortunately, nope :-(. We definitely need to address vue templates some time in the future, but right now it is not at the top of the priority list.
However, if you want to investigate it and maybe contribute your specific solution, the support may arrive faster to the official tool :-).
I can help you with specific bundler issues if you have doubts though I haven't played with vue templates yet, so I don't know what needs to be done specifically.
Cheers,
Ivan
Powered by Liferay™