onebangdeprecated

OneBang (aka 1!) turns attributes starting with ! into an easy way to write code shorthand.

Usage no npm install needed!

<script type="module">
  import onebang from 'https://cdn.skypack.dev/onebang';
</script>

README

OneBang

NPM version Build Status

OneBang (aka 1!) turns html attributes starting with ! into an easy way to write code shorthand.

Installation

OneBang is available on NPM for browser and webpack consumption. (Recommended)

$ npm i --save onebang

OneBang is also available from Github.

CDNs are also available. (Not Recommended)

<!-- Latest Version -->
<script src="https://unpkg.com/onebang/dist/onebang.min.js"></script>
<!-- Specific Version (e.g. 1.0.2) -->
<script src="https://unpkg.com/onebang@1.0.2/dist/onebang.min.js"></script>

Read the docs here and check out the tests here.

Example

Before

<div !id:example>
    <div !id:test !c:testclass !s:color:red>
        <i !i:fa:code></i> Test
    </div>
    <a !#:test>Scroll</a>
</div>

After

<div id="example">
    <div id="test" class="testclass" style="color:red;">
        <i class="fa fa-code"></i> Test
    </div>
    <a href="#test">Scroll</a>
</div>

Usage

<script src="onebang.js"></script> <!--Automatically adds window.onebang-->
var settings = {};
onebang(/* optional settings */ settings); //This starts processing.

Processing happens automatically when the document's body is updated for most browsers.

DOCUMENTATION

Read the documentation to set up and get to know OneBang.

License

MIT © Russell Steadman