Skip to content
Snippets Groups Projects
Select Git revision
  • 52ccff355a04a5e0d4054cd2cce7992cce2f0874
  • master default protected
  • 1.31
  • 4.38.8
  • 4.38.7
  • 4.38.6
  • 4.38.5
  • 4.38.4
  • 4.38.3
  • 4.38.2
  • 4.38.1
  • 4.38.0
  • 4.37.2
  • 4.37.1
  • 4.37.0
  • 4.36.0
  • 4.35.0
  • 4.34.1
  • 4.34.0
  • 4.33.1
  • 4.33.0
  • 4.32.2
  • 4.32.1
23 results

transformer.mjs

Blame
    • README.md NaN GiB 
    # Monster

Monster is an ideal choice for building visually appealing and high-performance web interfaces and websites using modern
JavaScript techniques.

By leveraging cutting-edge JavaScript features such as classes, WeakRef, WeakMaps, proxies, and the MutationObserver
interface, Monster
offers a blend of traditional methods and innovative web components.

Designed for seamless integration, Monster complements existing web projects without dominating the entire architecture.

Unlike solutions that introduce a new layer of abstraction and proprietary languages, Monster focuses on enhancing
the native capabilities of HTML, CSS, and JavaScript for web development.

With a design goal to optimize performance and achieve stellar outcomes, Monster achieves
this using minimal JavaScript code.

Monster is built with ES6 modules and uses
the [import](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/import)
and [export](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/export) statements.

For certain functions, additional [polyfills](#polyfill) may be required.

## Documentation

To access our documentation and examples, visit [monsterjs.org/](https://monsterjs.org/).

## Installation

Install Monster using npm, Yarn, or pnpm:

- `npm install @schukai/monster`
- `yarn add @schukai/monster`
- `pnpm add @schukai/monster`

## Usage

Here is a simple example of how to use Monster. We create a small file named `index.mjs`
(where 'm' stands for module). In this example, we perform substitutions in a string:

```js
import {Formatter} from '@schukai/monster/source/text/formatter.mjs';

const text = '${mykey${subkey}}';
let obj = {
    mykey2: "1",
    subkey: "2"
};

new Formatter(obj).format(text);
// Outputs: 1
```

To integrate this function into a website, it is recommended to use a bundler such
as [esbuild](https://esbuild.github.io/):

```sh
esbuild index.mjs --outfile=dist.js
```

You can now include it in your website:

```html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Monster</title>
    <script src="dist.js"></script>
</head>
<body>
```

Voilà!

### Polyfill

While we strive to work around some browser bugs, generally, we do not use polyfills or feature detection.
However, many functions can be supplemented through polyfills, thus enhancing compatibility.

## Questions

For questions and commercial support, please contact [schukai GmbH](https://www.schukai.com/).
The issue list of this repository is exclusively for bug reports and feature requests.

## Issues

Please ensure you read the Issue Reporting Checklist before opening an issue. Issues not conforming to the guidelines
may
be closed immediately.

## License

Copyright © 2024 schukai GmbH

Licensed under [AGPL](https://www.gnu.org/licenses/agpl-3.0.de.html). Commercial licenses are also available.

## Changelog

Detailed changes for each release are documented in the
[CHANGELOG](https://gitlab.schukai.com/oss/libraries/javascript/monster/-/blob/master/application/CHANGELOG.md).