Package Exports

vue-template-loader

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (vue-template-loader) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

vue-template-loader

Vue.js 2.0 template loader for webpack

This loader is just pre-compile a template by using vue-template-compiler and provide a function that can inject render function to a component options object.

Usually, you had better to use vue-loader.

Configuration for webpack

Just add loader option for vue-template-loader to your webpack configuration.

module.exports = {
  module: {
    loaders: [
      { test: /\.html$/, loader: 'vue-template' }
    ]
  }
}

Example code

Write a template of Vue component as html.

<!-- app.html -->
<div class="app">
  <p>{{ text }}</p>
  <button type="button" @click="log">Log</button>
</div>

Import it as a function and pass a component option to the function.

// app.js
import withRender from './app.html'

export default withRender({
  data () {
    return {
      text: 'Example text'
    }
  },

  methods: {
    log () {
      console.log('output log')
    }
  }
})

License

MIT