Vue: 真正的动态单文件组件

这个功能解决了什么问题？

我有一个应用程序，第三方可以在其中创建插件。 我希望他们能够将这些插件创建为单个文件组件，就像内置组件一样被拉入和显示。 现在，他们唯一的方法就是以这种形式创建一个组件：

{
template: "<div>stuff</div>",
props: ...
etc.
}

这很尴尬，而且没有简单的方法来包含样式。

更多详情： https :

我认为这样做的逻辑存在，但它在 vue-loader 中，并且真正打算与 Webpack 一起使用。 Webpack 不是为在运行时使用而设计的。

提议的 API 是什么样的？

<template>
  <div>
    The component goes here:
    <component :is="pluginComponent"></component>
  </div>
</template>
<script>
import { compileSFC } from "vue-template-compiler";
export default {
  data() {
    return {
      pluginComponent: null
    };
  },
  mounted() {
    // fetch code from some external source here
    let code = "<template><div>hello</div></template><style>some styles</style><script>some code</script>";
    let comp = compileSFC(code);
    this.pluginComponent = comp;
  }
};
</script>