# vue-ssr-loader

> 📝 Server Side Rendering without webpack

Latest version **0.5.0** (published 2019-04-28) · 0 weekly downloads

## Install

```sh
npm install vue-ssr-loader
pnpm add vue-ssr-loader
yarn add vue-ssr-loader
bun add vue-ssr-loader
```

## Health

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

Positive: no vulnerabilities.

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

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.5.0 |
| Published | 2019-04-28 |
| First published | 2019-01-06 |
| Weekly downloads | 0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 3 |
| Unpacked size | 6.2 KB |
| Known vulnerabilities | 0 (+2 in 2 direct dependencies) |
| Install scripts | no |
| GitHub stars | 0 |
| Maintainers | jooas |

## Links

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

## Dependencies (3)

- [vue](https://npm.io/package/vue.md) 2.5.21
- [vue-server-renderer](https://npm.io/package/vue-server-renderer.md) 2.5.21
- [vue-template-compiler](https://npm.io/package/vue-template-compiler.md) 2.5.21

## Recent versions

- 0.5.0 (latest) — 2019-04-28
- 0.2.0 — 2019-04-10
- 0.1.2 — 2019-02-08
- 0.1.0 — 2019-02-08
- 0.0.0 — 2019-01-06

## README

## Why is this necessary?
TODO

## Example

### Modification
In order to be able to represent both the client and the server in a single file, we divide them into tags.
The `<client>` tag includes everything that will be minified and injected into the template.
The `<server>` tag will be executed on the server, the result will be passed to a vue instance.
```html
<client>
  <template>
    <p>Hi {{name}}!</p>
  </template>

  <style>
    /* This will change the appearance of our <p> tag. */
    p {
      color: red;
    }
  </style>

  <script>
    console.info("This will show up in our DevTools. 🎉");
  </script>
</client>

<server>
  <script>
    // This will be passed to a vue instance.
    module.exports = {
      data: function () {
        return {
          name: "oas"
        }
      }
    };
  </script>
</server>
```

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