Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Plugin ordering for Vuetify - merge of user's & iles vite config #180

Open
TechAkayy opened this issue Aug 10, 2022 · 3 comments
Open

Plugin ordering for Vuetify - merge of user's & iles vite config #180

TechAkayy opened this issue Aug 10, 2022 · 3 comments
Labels
enhancement New feature or request

Comments

@TechAkayy
Copy link

TechAkayy commented Aug 10, 2022

Is your feature request related to a problem? Please describe.

When adding vite plugins via our own vite.config.js, there are some challenges when the user's vite config & iles config are merged. Specifically, the ordering of the vite plugins. For eg, when adding vuetify to Iles using enhanceApp api, it has to be added after vue plugin (@vitejs/plugin-vue), otherwise vuetify components won't compile correctly.

image

Describe the solution you'd like
May be something like what nuxt does - using custom module to insert plugins in the correct place - nuxt.hooks.hook('vite:extendConfig')?

(Or) implement a callback so that we can just .push() or .unshift() to the defaults?

Describe alternatives you've considered
I was able to insert the Vuetify plugin at the right spot by using my own custom plugin like below. May be this is how we could ideally do, instead of any other complex way (as suggested above)

	plugins: [
		{
			configResolved(config) {
				const idx_vue = config.plugins.findIndex(
					(plugin) => plugin.name && plugin.name === 'vite:vue'
				)
				config.plugins.splice(idx_vue + 1, 0, Vuetify()[0])
			}
		}
	],

Repo (that works with the custom plugin hack) - https://stackblitz.com/github/TechAkayy/my-iles-vuetify-app?file=vite.config.js

Additional context
Supporting vite plugins that enable usage of UI components library like vuetify is a great and must outcome that will tremendously boost Iles adoption across the large vue ecosystem as intented. Making this work could also open-up new avenues where vuetify-based custom theme-authoring for Iles could evolve. Thanks in advance!

@ElMassimo
Copy link
Owner

ElMassimo commented Aug 10, 2022

Ordering plugins is one of the unsolved UX problems in Rollup and Vite.

Some plugins will automatically reorder themselves in Vite when they detect they are in the wrong spot, and some leave the burden to the user to sort them correctly.

That said, it's not unreasonable to have a callback to inject plugins. API suggestions are welcome!

@ElMassimo ElMassimo added the enhancement New feature or request label Aug 10, 2022
@ElMassimo
Copy link
Owner

See this related RFC:

@TechAkayy
Copy link
Author

Thanks bunch ✌🏾

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

2 participants