Question

我创建了一个hello.vue文件，现在如何在html文件中使用它？我已经设置了一个webpack，

rnd

Answer 1

您想如何使用它？

从官方例子中示范：vue-hackernews-2.0。这是一个组件，因此您可以在component等其他vue文件中导入this：

import Comment from '../components/Comment.vue'

并添加that vue instance中的组件列表：

components: { Spinner, Comment },

您可以在HTML this中使用它：

<comment v-for="id in item.kids" :key="id" :id="id"></comment>

Answer 2

您只需将捆绑的.js文件包含在HTML文件中并包含mounter div - 因此Vue可以知道应用程序的执行位置。

您的索引文件看起来像这样（仅显示正文部分）

...
<body>

  <div id="app"></div>

  <script src="bundle.js">
</body>
...

您的主Vue文件可能如下所示：

import Vue from 'vue'
import Hello from 'hello.vue'

const app = new Vue({
  render: (h) => h(Hello)
}).$mount('#app')

通过这种方式，您可以将所有其他组件存储到hello.vue中。

这可能是您在构建SPA时应该使用的方式。