doc

index.html

<!doctype html>
<html lang="en">

<head>
<script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.14/vue.min.js"></script>
<script src="https://unpkg.com/http-vue-loader"></script>
</head>

<body>
<div id="app">
<my-component></my-component>
</div>

<script type="text/javascript">

new Vue({
el: '#app',
components: {
'my-component': httpVueLoader('my-component.vue')
      }
    });
</script>
</body>

</html>

my-component.vue

<template>
<div class="hello">
    Hello {{who}}
</div>
</template>

<script>
// 不支持 import
module.exports = {
data: function () {
return {
who: 'world',
    };
  },
components: {},
};
</script>

<style>
.hello {
background-color: #ffe;
}
</style>

使用 sass

<!-- 可选，使用sass -->
<script src="https://cdn.bootcdn.net/ajax/libs/sass.js/0.9.9/sass.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/sass.js/0.9.9/sass.worker.min.js"></script>

<script type="text/javascript">
// 可选, 使用scss
httpVueLoader.langProcessor.scss = function (scssText) {
return new Promise(function (resolve, reject) {
Sass.compile(scssText, function (result) {
if (result.status === 0)
resolve(result.text)
else
reject(result)
    });
  });
}
</script>

使用 less

<!-- 使用 less -->
<script src="https://cdn.jsdelivr.net/npm/less@4.1.1/dist/less.min.js"></script>

<script type="text/javascript">
httpVueLoader.langProcessor.less = function (lessText) {
return new Promise(function (resolve, reject) {
less.render(lessText, {}, function (err, css) {
if (err) {
reject(err)
      } else {
resolve(css.css);
      }
    })
  })
}
</script>

参考
​​Getting started with Sass.js​​https://github.com/FranckFreiburger/http-vue-loader/issues/20