Use JSX for HTML elements.
Based on @gera2ld/jsx-dom.
First, include @violentmonkey/dom as a dependency:
// ...
// @require https://cdn.jsdelivr.net/npm/@violentmonkey/dom@1
// ...Then you can use VM.createElement directly:
document.body.appendChild(VM.createElement('div', {}, 'hello'));Or use with JSX and bundlers, for example:
// .babelrc.js
{
plugins: [
'@babel/plugin-transform-react-jsx',
],
}const React = VM;
document.body.appendChild(<div>hello</div>);To initialize a project for userscript with JSX support, try generator-rollup:
$ mkdir project
$ cd project
$ npx -p https://github.com/gera2ld/generator-rollup.git -p yo yo @gera2ld/rollup:iifeVM.createElement(tag, props, ...children)