GitHub - kriboogh/framework7-component-loader

Webpack loader for Framework7 single file router components

What is Framework7 Component Loader?

framework7-component-loader is a loader for webpack that allows you to author Framework7 Router components in a format called Single-File Components:

<!-- my-page.f7.html -->
<template>
  <div class="page">{{msg}}</div>
</template>

<script>
export default {
  data () {
    return {
      msg: 'Hello world!'
    }
  }
}
</script>

Installation

npm i framework7-component-loader

Configuration

module.exports = {
  ...
  module: {
    rules: [
      ...
      {
        test: /\.f7.html$/,
        use: ['babel-loader', 'framework7-component-loader'],
      },
      ...
    ]
  }
  ...
}

Framework7 Webpack Template

There is already ready to use Framework7 Webpack Template pre-configured with framework7-component-loader