Hi, I'm configuring a custom component. This is my index.js:
import {createCustomElement} from '@servicenow/ui-core';
import snabbdom from '@servicenow/ui-renderer-snabbdom';
import styles from './styles.scss';
import '@servicenow/now-heading'
const view = (state, {updateState}) => {
return (
<div>
<now-heading label="Hi"/>
</div>
);
};
createCustomElement('snc-snc-notebook', {
renderer: {type: snabbdom},
view,
styles
});
This is my now-ui.json:
{
"components": {
"snc-snc-notebook": {
"innerComponents": ["now-header"],
"uiBuilder": {
"associatedTypes": ["global.core", "global.landing-page"],
"label": "My Component",
"icon": "document-outline",
"description": "A description of my component",
"category": "primitives"
}
}
},
"scopeName": "x_snc_snc_notebook"
}
When I render my component with snc ui-component develop -p nicola
I get the following error:
ERROR in ../node_modules/@servicenow/now-heading/src/now-heading.js 13:2
Module parse failed: Unexpected token (13:2)
You may need an appropriate loader to handle this file type.
| const HeadingLevel = `h${level}`;
| return (
> <HeadingLevel
| class={{
| 'now-heading': true,
@ ../node_modules/@servicenow/now-heading/src/index.js 1:0-26
@ ../src/snc-snc-notebook/index.js
@ ./element.js
@ multi ../node_modules/error-overlay-webpack-plugin/lib/entry-basic.js ../node_modules/error-overlay-webpack-plugin/lib/entry-devserver.js? ../node_modules/@servicenow/cli-component-archetype-dev/node_modules/webpack-dev-server/client?http://localhost:8081 ../node_modules/webpack/hot/dev-server.js ./element.js
ℹ ｢wdm｣: Failed to compile.
It seems an issue related to JSX, but I don't see from where this is coming from. Please can anyone help?
