1，引入组件1，引入组件在components目录创建组件，在页面中引入组件例如引入公共导航栏创建组件components/Nav.vue引入组件layouts/default.vue2，引入公共样式2，引入公共样式assets/css/common.cssassets/css/common.css在nuxt.config.js中引入若引入less或者sass：补充知识：在nuxt项目中使用component组件补充知识：补充知识：在nuxt项目中使用component组件编写组件页面编写组件页面1.在components下新建一个新建组件页面，如下所示2.新建完成之后初始页面的代码如下所示：3.下面从element-ui上找一个顶部导航菜单写到组件页面。
:default-active="activeIndex2"
class="el-menu-demo"
mode="horizontal"
@select="handleSelect"
background-color="#545c64"
text-color="#fff"
active-text-color="#ffd04b">
处理中心




选项1

选项2

选项3





选项1

选项2

选项3



消息中心
订单管理

:default-active="activeIndex2"
class="el-menu-demo"
mode="horizontal"
@select="handleSelect"
background-color="#545c64"
text-color="#fff"
active-text-color="#ffd04b">
处理中心




选项1

选项2

选项3





选项1

选项2

选项3



消息中心
订单管理
使用组件使用组件1.引入组件1.引入组件
import MinorTopMenu from '~/components/MinorTopMenu.vue'
import MinorTopMenu from '~/components/MinorTopMenu.vue'2.注册组件2.注册组件
components: {
MinorTopMenu
}
components: {
MinorTopMenu
}3.使用组件3.使用组件

4.页面代码截图4.页面代码截图测试测试打开页面，如下所示，说明组件使用成功以上这篇nuxt引入组件和公共样式的操作就是小编分享给大家的全部内容了，希望能给大家一个参考。