Scoped Styles

Thanks to @d0cm0d for the fantastic first PR

Introducing res.renderVueString()

It's like res.renderVue

but instead of super cool streams.... it returns a string.

It's blocking, and it's slower... but if you need a string instead of a stream.. here you go!

Pre-cache

Express-Vue now pre-caches all vue files on startup.

This will massively help initial request times.

Bye Bye string.js, hello js-to-string

• vue-pronto@1.2.1
• moved to better js to string method https://github.com/danmademe/js-to-string

Zero Config

You now no longer need to put in any config into express-vue's init method, it's now as simple as this.

const expressVue = require("express-vue");
const express = require("express");
const app = express();

const expressVueMiddleware = expressVue.init();
app.use(expressVueMiddleware);

HURRAH!! 🙌

v5 - PRONTO!

Summary

• Ditched the custom parser/renderer and moved to using vue-pronto which uses Vueify
• Re-structured the vueOptions
• Added req.vueOptions as a global.
• Removed the vue parent object with the child of head, this was un-needed its now just vueOptions.head instead of vueOptions.vue.head
  when using res.renderVue the filename requires an extention now.
• Paths are now RELATIVE to the file you're currently in ... YAAAY
• Node Modules are supported, for both javascript and vue file imports inside .vue files ... YAAAY
• Massive Performance gains
• 100% compatability with vueJS

Migration to Vue-Pronto

Express-vue-renderer got too heavy, the architecture became too messy, and it was slow. It needed to get thrown out. Enter vue-pronto it uses vueify under the hood, and is much more modular. this will be much easier going forward to maintain.

Changes to the Vue Options Object

There's been some big changes to this object, so before it would look like this

const vueOptions = {
    vue: {
        head: {
            meta: [
                { script: 'https://unpkg.com/vue@2.4.2/dist/vue.js'},
                { name: 'application-name', content: 'Name of my application' },
                { name: 'description', content: 'A description of the page', id: 'desc' },
                { style: '/assets/style.css' }
            ]
        }
    }
};

Now its different ..

• We have automated getting vueJS from the CDN for you, and which version (dev/prod) it should use based on the environment variable VUE_DEV.
• We also broke up the meta object, into metas, scripts, and styles arrays.
• scripts now have scriptSrc which is a string including the <script> elements which will be placed in your head as is.
• The parent vue object that wraps the head object was unneeded and removed.

here's the same as above but newer

const vueOptions = {
    vueOptions: "2.4.2",
    head: {
        metas: [
            { name: 'application-name', content: 'Name of my application' },
            { name: 'description', content: 'A description of the page', id: 'desc' },
        ],
        styles: [
            { style: '/assets/style.css' }
        ]
    }
};

Vue File changes

Routes before were relative to the rootPath... now that is gone... routes for requires are relative to the file you are currently in.
Also node_module paths are working for both .js and .vue includes

Remember to look at this if you're getting errors!

res.renderVue Changes

res.renderVue now requires an extension for the file you're using in the route. foo/bar now foo/bar.vue

New

Global req.vueOptions. this is super handy for passing options around between middleware.

4.0.12

Release 4.0.12

Minifies output

Shaves a few extra KB from the payload.

Few bugfixes for objects and vueoptions

Complete Re-write!

Welcome to the new express-vue

There's a lot of features, and new things.. its a massive change, and a breaking one if you're coming from v3.

No longer uses res.render() introducing res.renderVue()

We had to ditch res.render since this is a sync call, and slows down your server. It requires the library to have totally rendered everything before sending to the client.

We have replaced it with **res.renderVue() which returns a stream!

res.renderVue('nameofVueFile', {data}, {vueOptions})
// Note data, and vueOptions objects are optional

It's mostly the same, except its now non-blocking, This improves performance, before we were seeing an average of 140 requests a second, at about 1000ms lag, now were seeing 1000 requests a second at a 0.9ms lag (this is in production mode)

Migrated the engine into a separate project.

This allows us to have finer control over the library, and ultimately write the engine in C++. The long term plan is to have this library do nodeJS/Express ... and then write others for Java, Golang, and Swift

New instantiation and options

Before you had to use this as the view engine.. now its middleware.

var expressVue = require('express-vue');

var app = express();
const vueOptions = {
    rootPath: path.join(__dirname, '../example/views'),
    layout: {
        start: '<div id="app">',
        end: '</div>'
    }
};
const expressVueMiddleware = expressVue.init(vueOptions);
app.use(expressVueMiddleware);

Lots of the config has changed, its best to read the README.

Performance!!!!!!

Huge performance increase.

We started noticing concurrency issues at massive scale, so we have solved this issue.

Increases of 1000%!!

Huge thanks to @nick-fytros!!