Polyconseil / systematic

An opinionated ES6 toolchain for the browser.
25 stars 3 forks source link

Add support for build-time compilation of vue2 HTML templates #50

Closed rbarrois closed 6 years ago

rbarrois commented 7 years ago

At least with Vue.js 2, HTML templates should be compiled: the default build does not include the HTML template compiler (https://vuejs.org/v2/guide/installation.html#Runtime-Compiler-vs-Runtime-only)

According to the docs, it looks like we should compile those HTML templates to Vue.js render functions at build-time.

I can think of two approaches for this:

Note: With the second option, we'll have to decide on a convention to distinguish between a "simple HTML file" and "a Vue.js HTML template" based on its path/name/other.

For now, a workaround is to use an alternate variant of the vue build (with the template compiler included):

webpackDefaults.resolve.alias = {
  moment: 'cassets/scripts/moment',
}

With such a "full" build, we can use:

// src/components/foo/index.js
import template from './template.js'

export default {
    name: "Foo",
    template: template,
}

Running with a "production, no-compiler" build of Vue.js, we need to find a way to convert this at build time to:

// src/components/foo/index.js
export default {
    name: "Foo",
    render: function(createElement) {
        // ...
    },
}
vperron commented 7 years ago

I'd say the best option here would be to use vue-loader and adopt the *.vue files in the Vue profile overrides. I wasn't up for it but it seems most of the Vue ecosystem relies on those files, so please proceed.