全局变量和全局公用方法在开发中常见一些固定或者使用较广的方法，通过定义全局配置可以极大的减少代码量及便于后期的维护工作。

本篇文章就来介绍在nuxt3中如何定义全局变量及全局公用方法。

首先在项目跟目录下创建utils文件夹，该文件夹的js或ts文件同components、composables文件夹下文件一致会被自动导入。

一、全局变量定义及使用

    utils文件夹下创建（文件名.ts）文件，定义常量invoiceDataArr。文件内容如下：

//发票类型
interface invoice {
    name:string,
    type:number
}
export const invoiceDataArr:(invoice)[] = [
    {name:'不需要',type:1},
    {name:'个人',type:2},
    {name:'企业',type:3},
]

定义完成后，不同于nuxt2的需要单独引用。nuxt3会自动导入，接下来直接在需要的地方进行调用。

    1.1、template中全局常量使用

<template>
	<div>
		<span v-for="(item,index) in invoiceDataArr" :key="index">{{item.name}}</span>
	</div>
</template>

    1.2、setup中全局常量使用

<script lang="ts">
    import { defineComponent } from 'vue';
    export default defineComponent({ 
      setup() {
		console.log(invoiceDataArr)  
	  }
	})
</script>

二、全局公用方法定义及使用

    根目录utils文件夹下创建（文件名.ts/js）文件，定义a方法。

export  const a = () =>{
    return "sss"
}

    定义后，不需要任何引入直接在template或setup中进行使用。

    2.1、template中使用全局公用方法

<template>
	{{a()}}
</template>

    2.2、setup中使用全局公用方法

<script lang="ts">
    import { defineComponent } from 'vue';
    export default defineComponent({ 
      setup() {
		console.log(a())  
	  }
	})
</script>

    以上便是在nuxt3中关于全局常量的定义、公用方法的定义和对应使用流程。