Ask Questions and Find Answers

Hi,
Liferay 7.2, Chrome 78.0.3904.70
Have been following the "Developing Web Front Ends" Vue application subsection to create a "Hello World" type portlet to add to Liferay. I'm new to Liferay.https://portal.liferay.dev/docs/7-2/appdev/-/knowledge_base/a/developing-a-vue-application
I have created two portlets, one based on "Vue" and the other "Pure JavaScript", letting the tool add the default content to the portlets.Without changing anything I have successfully deployed both to a local version on liferay (a clean version using  the default test database).
Neither Portlet will render once added to a content page.  I get the following error, for both tested independently, which is traced back to an invalid JSON string.

loader.js:381 SyntaxError: Unexpected token p in JSON at position 22
&nbsp; &nbsp; at JSON.parse (<anonymous>)
&nbsp; &nbsp; at pure-javascript-portlet-content-page-:2614
&nbsp; &nbsp; at loader.js:379
&nbsp; &nbsp; at loader.js:343
</anonymous>

Extract from error origin (http://localhost:8080/web/guest/pure-javascript-portlet-content-page-):

if (initializer) {
     initializer(
       {
           configuration: {
                portletInstance: JSON.parse('{"portletSetupCss":"{\"portletData\":{\"useCustomTitle\":false,\"titles\":{},\"portletDecoratorId\":\"\"},\"advancedData\":{\"customCSSClassName\":\" portlet-barebone\"}}"}'),
                            system: JSON.parse('{}')
           },
           contextPath: '/o/pm-pure-js-portlet',
           portletElementId: 'js-portlet-_pmpurejsportlet_INSTANCE_KSG7kFL4NZ9f_',
           portletNamespace: '_pmpurejsportlet_INSTANCE_KSG7kFL4NZ9f_'
     );
}

The issue is that the  "portletSetupCss" property value is enclosed in double quotes. This  invalidates the JSON.Does anyone know if there is anything I can change in my setup to fix/avoid this issue or is this a bug I should report? Thanks for your time!