Vue中的全局组件（nuxt）

谷若汐2018-10-24

在构建Vue应用程序时，我们在每个模板中重用某些Vue组件。我们的网格系统存在于.region，.layout，.grid，.column元素之外。所有这些都是独立的Vue组件（，...）。我们现在最终在每个模板中执行此操作：

import BlMain from '~components/frame/main/Main.vue'
import BlRegion from '~components/frame/region/Region.vue'
import BlLayout from '~components/frame/layout/Layout.vue'
import BlGrid from '~components/frame/grid/Grid.vue'
import BlColumn from '~components/frame/column/Column.vue'

有没有办法在项目中全局导入Vue组件？是否可以选择创建包含上述导入的组件Frame.vue并在每个模板中添加Frame组件？其他FE框架如何解决这个问题？

我们在Vue上使用Nuxt JS。

// plugins/bl-components.js import Vue from 'vue' import BlMain from '~components/frame/main/Main.vue' import BlRegion from '~components/frame/region/Region.vue' import BlLayout from '~components/frame/layout/Layout.vue' import BlGrid from '~components/frame/grid/Grid.vue' import BlColumn from '~components/frame/column/Column.vue' const components = { BlMain, BlRegion, ... } Object.entries(components).forEach(([name, component]) => { Vue.component(name, component) }) // nuxt.config.js export default { plugins: ['~plugins/bl-components'] }