chore: organize codebase

[mukundshah]

• move eslint to root of project and update the config to use @antfu/eslint-config
• add vscode specific settings and extension recommendation
• update PR and Issues template
• perform some miscellaneous cleanup

[zernonia]

let's remove other "eslint config" file in radix-vue.

some minor suggestion, else lgtm!!!

[zernonia]

@mukundshah Thanks for the PR. However I only realized this changes broke the whole app, especially related to radix-vue package. If you look at any root component, you can see error TS1184: Modifiers cannot appear here., thus I've reverted it.

Could you look into that please? 😁

[mukundshah]

@zernonia <script setup> could not contain exports.

Reference:
eslint.vuejs.org/rules/no-export-in-script-setup.html
https://github.com/vuejs/rfcs/blob/master/active-rfcs/0040-script-setup.md

[zernonia]

@zernonia <script setup> could not contain exports.

Reference: eslint.vuejs.org/rules/no-export-in-script-setup.html https://github.com/vuejs/rfcs/blob/master/active-rfcs/0040-script-setup.md

hmm.. but it's not only in script setup, also in normal script tag. This changes kinda messed up the codebase, and had to refactor everything (which is not a good idea).

[Blinks44]

Is not exports in script-setup has been fixed in vue 3.3+?
vuejs/core#7794

[mukundshah]

@Blinks44 thank you for bringing that rfc tto attenttion.

@zernonia i studied the issue, and conducted some experiments as well.

The conclusion is:

• Only types and interface could be exported from <script setup>, which also suggests, it only works for TS.

• Named export of anything JS (variables, constants, or functoions) [aka ES Module exports] is not allowed.

• Exported interface and types should be first thing in the <script setup>.

• defineProps<PropsType> generates wrong code in typescript when PropsType is exported vuejs/core#7794

• <script setup> vuejs/rfcs#227

• https://github.com/vuejs/language-tools/blob/4e20cfbb354671c4621d5bebeded2cbd3b430703/vue-language-tools/vue-language-service/src/plugins/vue.ts#L156
  though is really old commit, i tested it, and it is still true

Both the editor and vue-tsc should have thrown error/warnings at the very beginning. I reverted every change I made, and I got red everywhere it's supposed to. Thus, the final conclusion is a refactor.

[zernonia]

@Blinks44 thank you for bringing that rfc tto attenttion.

@zernonia i studied the issue, and conducted some experiments as well.

The conclusion is:

• Only types and interface could be exported from <script setup>, which also suggests, it only works for TS.
• Named export of anything JS (variables, constants, or functoions) [aka ES Module exports] is not allowed.
• Exported interface and types should be first thing in the <script setup>.
• defineProps generates wrong code in typescript when PropsType is exported vuejs/core#7794
• <script setup> vuejs/rfcs#227
• https://github.com/vuejs/language-tools/blob/4e20cfbb354671c4621d5bebeded2cbd3b430703/vue-language-tools/vue-language-service/src/plugins/vue.ts#L156
  though is really old commit, i tested it, and it is still true

Both the editor and vue-tsc should have thrown error/warnings at the very beginning. I reverted every change I made, and I got red everywhere it's supposed to. Thus, the final conclusion is a refactor.

I think you missed my pointer earlier @mukundshah .
I know script setup only export ineterface/types, but the script tag should be able to export const, as it acts like a normal js file.

I know the syntatic sugar script setup has it's limitation, but using script itself works pretty well, and it does all the job we want it to do. This definitely not called for a refactor. And I hope that you understand, this refactor is super unncessary if we dont have a clear and heavily favoured benefit that it will bring.

Furthermore, I found support for defineComponent is quite limitated with TS. You can checkout the TS for props/emits defined in each component in Headless UI. All these is not not neccessary with the current .vue SFC approach that we have.

You might argue that >3.3 we can have better types for defineComponent, yes you are right, but it's still limited as we still need to manually define the emits in each component.

[zernonia]

Also, I've found a way to use antfu/eslint, by having the following config. Doing so we prevent all exports being moved to script setup, which prevent us from having those export const issue.

eslint-plugin-vue currently have no active way to distinguish script & script setup due to how it was wired in vue/core. So we can just disable this eslint hint for our repo.

Reference: vuejs/eslint-plugin-vue#1577

module.exports = {
  extends: '@antfu',

  rules: {
    'import/first': 'off',
  },
}

Note:

• all types work correctly with script tag exporting const
  

• all types works correctly with importing the exported const
  

[mukundshah]

I know script setup only export ineterface/types, but the script tag should be able to export const, as it acts like a normal js file.

@zernonia we still need to refactor the code base. Those exports need to be arranged. Isn't it?

[zernonia]

I know script setup only export ineterface/types, but the script tag should be able to export const, as it acts like a normal js file.

@zernonia we still need to refactor the code base. Those exports need to be arranged. Isn't it?

Nope. Not needed 😁