@etcher/core NPM

Etcher

A ✨ blazingly fast ✨ frontend 'framework' to create reusable web components without touching a single line of javascript.

Why?

Etcher allows you to take advantage of custom elements, a feature natively supported in all major browsers.

Ethcer's custom web elements have

CSS Scoping through the Shadow DOM
Event handling
Reusability
Reactivity

and much more.

VS Code Extension

Etcher comes with a VS Code extension that allows you to access syntax highlighting, code completion, and more.

Installation

npm i @etcher/core -g

Usage

To use etcher, you need to follow this directory structure:

├── src
│   ├── components
│   |   └── ...component xtml files
│   ├── pages
│   |   └── ...page xtml files

(You can configure these directories in the etcher.config.js file.)

To generate your pages, run:

etcher -b # build
etcher -w # watch
etcher <> -s # serve

This will move all your pages into your public directory and add the necessary scripts to them.

Configuration

You can configure etcher by creating a etcher.config.js file in the root directory of your project. Here's an example:

export default {
    input: 'src',
    output: 'dist',
    plugins: [
        // ...
    ],
};

Example

<!-- src/pages/index.xtml -->
<html>
    <body>
        <!-- our `label` attribute will be passed to the button file -->
        <etcher-Button label="Click Me!"></etcher-Button>
    </body>
</html>

<!-- src/components/Button.xtml -->
<button>{{props.label}}</button>

etcher framework web-components frontend

vite

@infinitebrahmanuniverse/nolb-_et @everything-registry/sub-chunk-298 @zalastax/nolb-_et

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago