unplugin-auto-import VS rfcs

Unplugin auto import

You looked through https://github.com/antfu/unplugin-auto-import/issues/61, https://github.com/unjs/unimport/pull/218 and https://github.com/antfu/unplugin-auto-import/issues/61?

unplugin-auto-import, let's you set what any library to be automatically imported. It has reasonable defaults for popular libraries.

AutoImport({ // targets to transform include: [ /\.[tj]sx?$/, // .ts, .tsx, .js, .jsx /\.vue$/, /\.vue\?vue/, // .vue /\.md$/, // .md ], // global imports to register imports: [ // presets 'vue', 'vue-router', // custom { '@vueuse/core': [ // named imports 'useMouse', // import { useMouse } from '@vueuse/core', // alias ['useFetch', 'useMyFetch'], // import { useFetch as useMyFetch } from '@vueuse/core', ], 'axios': [ // default imports ['default', 'axios'], // import { default as axios } from 'axios', ], '[package-name]': [ '[import-names]', // alias ['[from]', '[alias]'], ], }, ], // Enable auto import by filename for default module exports under directories defaultExportByFilename: false, // Auto import for module exports under directories // by default it only scan one level of modules under the directory dirs: [ // './hooks', // './composables' // only root modules // './composables/**', // all nested modules // ... ], // Filepath to generate corresponding .d.ts file. // Defaults to './auto-imports.d.ts' when `typescript` is installed locally. // Set `false` to disable. dts: './auto-imports.d.ts', // Auto import inside Vue template // see https://github.com/unjs/unimport/pull/15 and https://github.com/unjs/unimport/pull/72 vueTemplate: false, // Custom resolvers, compatible with `unplugin-vue-components` // see https://github.com/antfu/unplugin-auto-import/pull/23/ resolvers: [ /* ... */ ], // Generate corresponding .eslintrc-auto-import.json file. // eslint globals Docs - https://eslint.org/docs/user-guide/configuring/language-options#specifying-globals eslintrc: { enabled: false, // Default `false` filepath: './.eslintrc-auto-import.json', // Default `./.eslintrc-auto-import.json` globalsPropValue: true, // Default `true`, (true | false | 'readonly' | 'readable' | 'writable' | 'writeable') }, })

If you don’t want to write the import everywhere, use a unplug auto importing plug-in: https://github.com/antfu/unplugin-auto-import

I forgot to specify, for the AutoImport I'm using unplugin-auto-import/vite

Others have already mentioned answers but I just want to say if you are bothered by importing reactive and computed take a look at https://github.com/antfu/unplugin-auto-import.

You can check out https://github.com/antfu/unplugin-auto-import

```

We started experimenting with this ling of thought almost 3 years ago:

- First take (ref sugar), Nov 2020: https://github.com/vuejs/rfcs/pull/228

- Take 2, Aug 2021: https://github.com/vuejs/rfcs/pull/368

- Take 3, Nov 2021: https://github.com/vuejs/rfcs/discussions/369

We provided it as an experimental feature and had a decent number of users trying it out in production. The feedback wasn't great and eventually decided to drop it. https://github.com/vuejs/rfcs/discussions/369#discussioncomm...

This is a personal preference, but I use ref almost all the time. Despite tediously writing the .value to access the ref’s value, the Vue team is aware of the problem, and the open RFC - Reactivity Transform, was aiming to solve this issue, however, seems like it was abandoned.

To stay updated, follow the RFC at https://github.com/vuejs/rfcs/discussions/503.

This was a good change. Evan has always been extremely good at putting his finger on the pulse of the frontend community. If there's a feature or paradigm that people love that would fit in Vue, Evan will incorporate it. Over the years, Vue has implemented (and sometimes later deprecated) dependency injection, JSX support, custom elements, Angular-style class components, Svelte-style ref sugar, and now Solid-inspired compiler optimizations. They even changed the order of a Vue file to match that of Svelte: first the script, then the template.

Now the $on has been removed, but the event subject is causing some confusion, see: https://github.com/vuejs/rfcs/discussions/397

The RFC has shown that this feature is very controversial, with lots of implications. Personally, I liked it at first, but now I'm against it.

Here is the Current language: https://github.com/vuejs/rfcs/blob/function-apis/active-rfcs/0000-function-api.md

Plus, even that there is a real possibility that the controversial Reactivity Transform RFC leads to a Vue 4 version, it is likely to bring just minor breaking changes from Vue 3.