x-view

A JavaScript library like React, but uses Web Components.

Usage no npm install needed!

<script type="module">
  import xView from 'https://cdn.skypack.dev/x-view';
</script>

README

X-View

npm npm

A JavaScript library like React, but uses Web Components.

Requirements

Supports / Polyfills for:

  • Object.assign
  • WeakMap
  • Custom Elements
  • Shadow DOM

Installation

$ npm install --save x-view

Documentations

Example

<x-button></x-button>

var x = require("x-view");

var Button = x.createClass({
  render: function() {
    return x.createElement("button", {
      type: "button"
    }, ["Hello!"]);
  }
});

x.register("x-button", Button);

More examples...

JSX

/** @jsx x.jsx */

var vtree = (<div class="box">
  <x-button />
</div>);

Output:

/** @jsx x.jsx */

"use strict";

var vtree = x.jsx(
  "div",
  { "class": "box" },
  x.jsx("x-button", null)
);

Built-in Tags

  • <x-raw html="..."></x-raw>

License

MIT License