Getting SmarkForm

📖 Table of Contents

Available formats
Using a CDN (Esiest approach)
- ES module
- UMD Module
Download minified
Installing it from NPM
Clone from GitHub

Available formats

SmarkForm is provided in two alternative formats:

ESM module (SmarkForm.esm.js) which is built as an ECMAScript module (ESM) and can be imported directly using the import statement in modern JavaScript environments. It allows for tree-shaking and efficient module management.
UMD (SmarkForm.umd.js) which is a universal format that works both in browsers and in module systems like CommonJS and AMD. It can be loaded through any UMD compatibley module loader such as RequireJS or directly via a

To incorporate SmarkForm to your project you have several alternatives:

Using a CDN (Esiest approach)

This is the quicker method for playground and testing apps.

ES module

👉 Import it as ES module:

<script type="module">
  import SmarkForm from 'https://cdn.jsdelivr.net/npm/smarkform/dist/SmarkForm.esm.js';
  
  // Use SmarkForm in your code
</script>

UMD Module

👉 Include it your HTML file using a <script> tag:

<script src="https://cdn.jsdelivr.net/npm/smarkform/dist/SmarkForm.umd.js"></script>
<script>
    // Now it is avalable as SmarkForm global variable.
</script>

👉 Import as CommonJS module:

const SmarkForm = require("https://cdn.jsdelivr.net/npm/smarkform/dist/SmarkForm.umd.js");

👉 Import as AMD (RequireJS) module:

require(['https://cdn.jsdelivr.net/npm/smarkform/dist/SmarkForm.umd.js'], function(SmarkForm) {
  // Now it is avalable as SmarkForm local variable.
});

📌 These examples will use the latest published version of SmarkForm from NPM (better for development / testing / training).

For production code is advised to rely on specific version CDN to keep it working despite any future changes.

See CDN Resources section for more details…

Download minified

Go to Download section to obtain a minified versionof Smarkform you can then serve toghether with your app.

Installing it from NPM

👉 Execute:

npm install smarkform

👉 Then you can use it with your favourite bundler or pick it in your preferred format:

node_modules
└── smarkform
    └── dist
        ├── SmarkForm.esm.js
        └── SmarkForm.umd.js

If you’re using Express and want to avoid publishing your entire node_modules directory or manually configuring custom routes, you can use the ESMrouter package from NPM. This package simplifies routing for ECMAScript modules in Express, saving you time and effort.

Clone from GitHub

👉 Execute:

git clone git@github.com:bitifet/SmarkForm.git

👉 Then, like with NPM package, you will find everything under the dist directory:

dist
├── SmarkForm.esm.js
├── SmarkForm.esm.js.map
├── SmarkForm.umd.js
├── SmarkForm.umd.js.map
└── examples
    ├── smarkform_layout_sample.css
    └── smarkform_styles_sample.css

You can also install dev dependencies by running npm run dev to start developping or npm run bundle to just rebuild everything.

For more information, execute npm run alone:

$ npm run
Lifecycle scripts included in smarkform@0.5.1:
  pretest
    npm run build
  test
    mocha
available via `npm run-script`:
  build
    scripts/build_production_smarkform.sh
  doc
    scripts/build_documentation_site.sh
  bundle
    scripts/build_all.sh
  watch
    scripts/livebuild_dev_smarkform.sh
  servedoc
    scripts/liveserve_documentation_site.sh
  dev
    scripts/liveserve_documentation_site.sh