# rioct-loader

> rioct templates webpack loader

Latest version **0.7.1** (published 2017-03-22) · MIT license · 0 weekly downloads

## Install

```sh
npm install rioct-loader
pnpm add rioct-loader
yarn add rioct-loader
bun add rioct-loader
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.7.1 |
| Published | 2017-03-22 |
| First published | 2016-07-29 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Antonino Porcino |
| Maintainers | nippur72 |

## Links

- npm: https://www.npmjs.com/package/rioct-loader
- Repository: https://github.com/nippur72/rioct-loader
- Homepage: https://github.com/nippur72/rioct-loader#readme
- Issues: https://github.com/nippur72/rioct-loader/issues
- npm.io page: https://npm.io/package/rioct-loader

## Dependencies (1)

- [rioct-cli](https://npm.io/package/rioct-cli.md) >=3.0.0

## Recent versions

- 0.7.1 (latest) — 2017-03-22
- 0.7.0 — 2016-08-27
- 0.6.0 — 2016-08-19
- 0.5.0 — 2016-08-17
- 0.4.0 — 2016-08-15
- 0.3.1 — 2016-08-12
- 0.3.0 — 2016-08-12
- 0.2.0 — 2016-07-29
- 0.1.0 — 2016-07-29
- 0.0.2 — 2016-07-29
- 0.0.1 — 2016-07-29

## README

# rioct-loader

`rioct-loader` is the webpack loader for [Rioct](https://github.com/nippur72/rioct-cli) templates.

Allows to `require()` template source files directly from JavaScript,
letting Webpack compile them and put in the bundle.

## Installation

Install in your Webpack build directory with:
```
npm install --save-dev rioct-loader
```

## Configuration

Modify `webpack.config.js` (or any other Webpack config file):

```
module.exports = {
  // ...
  module: {
    // ...
    loaders: [{
      test: /\.tag.html?$/,    // or another file extension of your choice
      loader: "rioct-loader"   // or with options: "rioct-loader?trace=false&brackets={{ }}&useRioctRuntime=true"
    }]
    // ...
  }
  // ...
}
```

## Usage

From JavaScript and React:
```
// === if it's a stateless component ===
const MyComponent = require("./my-component.tag.html");

// === if it's a stateful component ===
class MyComponent extends React.Component {
   render = require("./my-component.tag.html");
}

ReactDOM.render(React.createElement(MyComponent), document.body);
```

## How it works

When building the bundle, Webpack will intercept all `require()` with filenames
ending in `.tag.html`, then it calls `rioct-cli` to compile the template
and the resulting code is given as result for the `require()` call.

---
_Source: https://npm.io/package/rioct-loader · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
