mirror of
https://github.com/withastro/astro.git
synced 2025-02-17 22:44:24 -05:00
feat(vue): add support vue devtools options (#11055)
Co-authored-by: Erika <3019731+Princesseuh@users.noreply.github.com> Co-authored-by: Jan-Niklas Wortmann <jan-niklas.wortmann@jetbrains.com> Co-authored-by: Florian Lefebvre <contact@florian-lefebvre.dev>
This commit is contained in:
parent
a687a17645
commit
b92de22d28
4 changed files with 47 additions and 30 deletions
21
.changeset/sweet-needles-juggle.md
Normal file
21
.changeset/sweet-needles-juggle.md
Normal file
|
@ -0,0 +1,21 @@
|
|||
---
|
||||
"@astrojs/vue": minor
|
||||
---
|
||||
|
||||
Updates the `devtools` type to allow passing `VueDevToolsOptions`
|
||||
|
||||
For more customization, you can pass options that the [Vue DevTools Vite Plugin](https://devtools-next.vuejs.org/guide/vite-plugin#options) supports. (Note: `appendTo` is not supported.) For example, you can set `launchEditor` to your preferred editor if you are not using Visual Studio Code:
|
||||
|
||||
```js title="astro.config.mjs"
|
||||
import { defineConfig } from "astro/config";
|
||||
import vue from "@astrojs/vue";
|
||||
|
||||
export default defineConfig({
|
||||
// ...
|
||||
integrations: [
|
||||
vue({
|
||||
devtools: { launchEditor: "webstorm" },
|
||||
}),
|
||||
],
|
||||
});
|
||||
```
|
|
@ -43,7 +43,7 @@
|
|||
"@vitejs/plugin-vue": "^5.0.4",
|
||||
"@vitejs/plugin-vue-jsx": "^3.1.0",
|
||||
"@vue/compiler-sfc": "^3.4.27",
|
||||
"vite-plugin-vue-devtools": "^7.1.3"
|
||||
"vite-plugin-vue-devtools": "^7.2.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"astro": "workspace:*",
|
||||
|
|
|
@ -5,6 +5,7 @@ import type { Options as VueJsxOptions } from '@vitejs/plugin-vue-jsx';
|
|||
import { MagicString } from '@vue/compiler-sfc';
|
||||
import type { AstroIntegration, AstroRenderer, HookParameters } from 'astro';
|
||||
import type { Plugin, UserConfig } from 'vite';
|
||||
import type {VitePluginVueDevToolsOptions} from "vite-plugin-vue-devtools";
|
||||
|
||||
const VIRTUAL_MODULE_ID = 'virtual:@astrojs/vue/app';
|
||||
const RESOLVED_VIRTUAL_MODULE_ID = `\0${VIRTUAL_MODULE_ID}`;
|
||||
|
@ -12,7 +13,7 @@ const RESOLVED_VIRTUAL_MODULE_ID = `\0${VIRTUAL_MODULE_ID}`;
|
|||
interface Options extends VueOptions {
|
||||
jsx?: boolean | VueJsxOptions;
|
||||
appEntrypoint?: string;
|
||||
devtools?: boolean;
|
||||
devtools?: boolean | Omit<VitePluginVueDevToolsOptions, "appendTo">;
|
||||
}
|
||||
|
||||
function getRenderer(): AstroRenderer {
|
||||
|
@ -125,9 +126,11 @@ async function getViteConfiguration(
|
|||
|
||||
if (command === 'dev' && options?.devtools) {
|
||||
const vueDevTools = (await import('vite-plugin-vue-devtools')).default;
|
||||
const devToolsOptions = typeof options.devtools === 'object' ? options.devtools : {}
|
||||
config.plugins?.push(
|
||||
vueDevTools({
|
||||
appendTo: VIRTUAL_MODULE_ID,
|
||||
...devToolsOptions,
|
||||
appendTo: VIRTUAL_MODULE_ID
|
||||
})
|
||||
);
|
||||
}
|
||||
|
|
47
pnpm-lock.yaml
generated
47
pnpm-lock.yaml
generated
|
@ -5366,8 +5366,8 @@ importers:
|
|||
specifier: ^3.4.27
|
||||
version: 3.4.27
|
||||
vite-plugin-vue-devtools:
|
||||
specifier: ^7.1.3
|
||||
version: 7.1.3(vite@5.2.11)(vue@3.4.27)
|
||||
specifier: ^7.2.0
|
||||
version: 7.2.0(vite@5.2.11)(vue@3.4.27)
|
||||
devDependencies:
|
||||
astro:
|
||||
specifier: workspace:*
|
||||
|
@ -5956,7 +5956,7 @@ packages:
|
|||
'@babel/helper-optimise-call-expression': 7.22.5
|
||||
'@babel/helper-replace-supers': 7.24.1(@babel/core@7.24.5)
|
||||
'@babel/helper-skip-transparent-expression-wrappers': 7.22.5
|
||||
'@babel/helper-split-export-declaration': 7.22.6
|
||||
'@babel/helper-split-export-declaration': 7.24.5
|
||||
semver: 6.3.1
|
||||
dev: false
|
||||
|
||||
|
@ -6066,13 +6066,6 @@ packages:
|
|||
'@babel/types': 7.24.5
|
||||
dev: false
|
||||
|
||||
/@babel/helper-split-export-declaration@7.22.6:
|
||||
resolution: {integrity: sha512-AsUnxuLhRYsisFiaJwvp1QF+I3KjD5FOxut14q/GzovUe6orHLesW2C7d754kRm53h5gqrz6sFl6sxc4BVtE/g==}
|
||||
engines: {node: '>=6.9.0'}
|
||||
dependencies:
|
||||
'@babel/types': 7.24.5
|
||||
dev: false
|
||||
|
||||
/@babel/helper-split-export-declaration@7.24.5:
|
||||
resolution: {integrity: sha512-5CHncttXohrHk8GWOFCcCl4oRD9fKosWlIRgWm4ql9VYioKm52Mk2xsmoohvm7f3JoiLSM5ZgJuRaf5QZZYd3Q==}
|
||||
engines: {node: '>=6.9.0'}
|
||||
|
@ -9319,11 +9312,11 @@ packages:
|
|||
'@vue/compiler-dom': 3.4.27
|
||||
'@vue/shared': 3.4.27
|
||||
|
||||
/@vue/devtools-core@7.1.3(vite@5.2.11)(vue@3.4.27):
|
||||
resolution: {integrity: sha512-pVbWi8pf2Z/fZPioYOIgu+cv9pQG55k4D8bL31ec+Wfe+pQR0ImFDu0OhHfch1Ra8uvLLrAZTF4IKeGAkmzD4A==}
|
||||
/@vue/devtools-core@7.2.0(vite@5.2.11)(vue@3.4.27):
|
||||
resolution: {integrity: sha512-cHSeu70rTtubt2DYia+VDGNTC1m84Xyuk5eNTjmOpMLECaJnWnzCv6kR84EZp7rG+MVZalJG+4ecX2GaTbU3cQ==}
|
||||
dependencies:
|
||||
'@vue/devtools-kit': 7.1.3(vue@3.4.27)
|
||||
'@vue/devtools-shared': 7.1.3
|
||||
'@vue/devtools-kit': 7.2.0(vue@3.4.27)
|
||||
'@vue/devtools-shared': 7.2.0
|
||||
mitt: 3.0.1
|
||||
nanoid: 3.3.7
|
||||
pathe: 1.1.2
|
||||
|
@ -9333,12 +9326,12 @@ packages:
|
|||
- vue
|
||||
dev: false
|
||||
|
||||
/@vue/devtools-kit@7.1.3(vue@3.4.27):
|
||||
resolution: {integrity: sha512-NFskFSJMVCBXTkByuk2llzI3KD3Blcm7WqiRorWjD6nClHPgkH5BobDH08rfulqq5ocRt5xV+3qOT1Q9FXJrwQ==}
|
||||
/@vue/devtools-kit@7.2.0(vue@3.4.27):
|
||||
resolution: {integrity: sha512-Kx+U0QiQg/g714euYKfnCdhTcOycSlH1oyTE57D0sAmisdsRCNLfXcnnIwcFY2jdCpuz9DNbuE0VWQuYF5zAZQ==}
|
||||
peerDependencies:
|
||||
vue: ^3.0.0
|
||||
dependencies:
|
||||
'@vue/devtools-shared': 7.1.3
|
||||
'@vue/devtools-shared': 7.2.0
|
||||
hookable: 5.5.3
|
||||
mitt: 3.0.1
|
||||
perfect-debounce: 1.0.0
|
||||
|
@ -9346,8 +9339,8 @@ packages:
|
|||
vue: 3.4.27(typescript@5.4.5)
|
||||
dev: false
|
||||
|
||||
/@vue/devtools-shared@7.1.3:
|
||||
resolution: {integrity: sha512-KJ3AfgjTn3tJz/XKF+BlVShNPecim3G21oHRue+YQOsooW+0s+qXvm09U09aO7yBza5SivL1QgxSrzAbiKWjhQ==}
|
||||
/@vue/devtools-shared@7.2.0:
|
||||
resolution: {integrity: sha512-gVr3IjKjU7axNvclRgICgy1gq/TDnF1hhBAEox+l5mMXZiTIFVIm1zpcIPssc0HxMDgzy+lXqOVsY4DGyZ+ZeA==}
|
||||
dependencies:
|
||||
rfdc: 1.3.1
|
||||
dev: false
|
||||
|
@ -16809,8 +16802,8 @@ packages:
|
|||
- supports-color
|
||||
dev: false
|
||||
|
||||
/vite-plugin-vue-devtools@7.1.3(vite@5.2.11)(vue@3.4.27):
|
||||
resolution: {integrity: sha512-qv8Z4yok9RYo6TEs89WnIAlmTHby/+XTim8tlSnMs3lAPcQqqcl/wGRY8gAeYrGCANngOqO+VuabW3Jb1HZtyw==}
|
||||
/vite-plugin-vue-devtools@7.2.0(vite@5.2.11)(vue@3.4.27):
|
||||
resolution: {integrity: sha512-bFWwx/YF9M+aXTjDo0/6DrC7+WCzLg7wAmFoQA3Gd7cv5WV4u65hHSZN8bq0zhgHqtYQZdWnp0L2z6JNCwcIGg==}
|
||||
engines: {node: '>=v14.21.3'}
|
||||
peerDependencies:
|
||||
vite: ^3.1.0 || ^4.0.0-0 || ^5.0.0-0
|
||||
|
@ -16818,14 +16811,14 @@ packages:
|
|||
vite:
|
||||
optional: true
|
||||
dependencies:
|
||||
'@vue/devtools-core': 7.1.3(vite@5.2.11)(vue@3.4.27)
|
||||
'@vue/devtools-kit': 7.1.3(vue@3.4.27)
|
||||
'@vue/devtools-shared': 7.1.3
|
||||
'@vue/devtools-core': 7.2.0(vite@5.2.11)(vue@3.4.27)
|
||||
'@vue/devtools-kit': 7.2.0(vue@3.4.27)
|
||||
'@vue/devtools-shared': 7.2.0
|
||||
execa: 8.0.1
|
||||
sirv: 2.0.4
|
||||
vite: 5.2.11(@types/node@18.19.31)(sass@1.77.1)
|
||||
vite-plugin-inspect: 0.8.4(vite@5.2.11)
|
||||
vite-plugin-vue-inspector: 5.0.1(vite@5.2.11)
|
||||
vite-plugin-vue-inspector: 5.1.0(vite@5.2.11)
|
||||
transitivePeerDependencies:
|
||||
- '@nuxt/kit'
|
||||
- rollup
|
||||
|
@ -16833,8 +16826,8 @@ packages:
|
|||
- vue
|
||||
dev: false
|
||||
|
||||
/vite-plugin-vue-inspector@5.0.1(vite@5.2.11):
|
||||
resolution: {integrity: sha512-R93P8iFa6BPODhc/aOtO04A8FFMMyFIfm8ZVSmN+8vU1TgwsHya734APGpX4fVHSPX2aVwYyiezXBUYQ0Opsqw==}
|
||||
/vite-plugin-vue-inspector@5.1.0(vite@5.2.11):
|
||||
resolution: {integrity: sha512-yIw9dvBz9nQW7DPfbJtUVW6JTnt67hqTPRnTwT2CZWMqDvISyQHRjgKl32nlMh1DRH+92533Sv6t59pWMLUCWA==}
|
||||
peerDependencies:
|
||||
vite: ^3.0.0-0 || ^4.0.0-0 || ^5.0.0-0
|
||||
peerDependenciesMeta:
|
||||
|
|
Loading…
Add table
Reference in a new issue