import { globalIgnores } from 'eslint/config'
import { defineConfigWithVueTs, vueTsConfigs } from '@vue/eslint-config-typescript'
import pluginVue from 'eslint-plugin-vue'
// import typescriptEslint from 'typescript-eslint';
// To allow more languages other than `ts` in `.vue` files, uncomment the following lines:
// import { configureVueProject } from '@vue/eslint-config-typescript'
// configureVueProject({ scriptLangs: ['ts', 'tsx'] })
// More info at https://github.com/vuejs/eslint-config-typescript/#advanced-setup
export default defineConfigWithVueTs(
 {
 name: 'app/files-to-lint',
 files: ['**/*.{ts,mts,tsx,vue}'],
 },
 globalIgnores(['**/dist/**', '**/dist-ssr/**', '**/coverage/**']),
 pluginVue.configs['flat/essential'],
 // typescriptEslint.configs.recommended,
 vueTsConfigs.recommended,
 {
 name: "other",
 rules: {
 "vue/prop-name-casing": "error"
 // "@typescript-eslint/no-floating-promises":"error",
 // "@typescript-eslint/return-await": ["error", "always"],
 }
 }
)

<template>
 <div >
 {{ foo }}
 </div>
</template>
<script setup lang="ts">
import { computed } from 'vue';
import type { SomeType } from './types';
 // no error here! 
defineProps<SomeType>()

 // no error here!
 const foo = computed(() => {
 return "hello";
 });
</script>

//types.ts
export type SomeType = {
 foo: string;
 "kebab-case-property": string;
}

<template>
 <div >
 {{ foo }}
 </div>
</template>
<script setup lang="ts">
import { computed } from 'vue';



 defineProps<{
 foo: string;
 //Prop "kebab-case-property" is not in camelCase.eslintvue/prop-name-casing
 "kebab-case-property": string;
 }>()

 //Duplicate key 'foo'. May cause name collision in script or template tag.eslintvue/no-dupe-keys
 const foo = computed(() => {
 return "hello";
 });
</script>

export default defineConfigWithVueTs(
 {
 name: 'app/files-to-lint',
 files: ['**/*.{ts,mts,tsx,vue}'],
 },
 globalIgnores(['**/dist/**', '**/dist-ssr/**', '**/coverage/**']),
 pluginVue.configs['flat/essential'],
 // typescriptEslint.configs.recommended,
 vueTsConfigs.recommended,
 {
 plugins: {
 "@typescript-eslint": typescriptEslint.plugin //👈
 },
 name: "other",
 rules: {
 "vue/prop-name-casing": "error",
 "@typescript-eslint/no-floating-promises":"error", //👈
 }
 }
)