feat(plugin-vue): add features option (#419) · vitejs/vite-plugin-vue@3e839e2 (original) (raw)
`@@ -33,6 +33,9 @@ export interface Options {
`
33
33
`include?: string | RegExp | (string | RegExp)[]
`
34
34
`exclude?: string | RegExp | (string | RegExp)[]
`
35
35
``
``
36
`+
/**
`
``
37
`+
- In Vite, this option follows Vite's config.
`
``
38
`+
*/
`
36
39
`isProduction?: boolean
`
37
40
``
38
41
`// options to pass on to vue/compiler-sfc
`
`@@ -47,6 +50,7 @@ export interface Options {
`
47
50
`| 'genDefaultAs'
`
48
51
`| 'customElement'
`
49
52
`| 'defineModel'
`
``
53
`+
| 'propsDestructure'
`
50
54
`>
`
51
55
`> & {
`
52
56
`/**
`
`@@ -88,19 +92,37 @@ export interface Options {
`
88
92
`| 'preprocessOptions'
`
89
93
`>
`
90
94
`>
`
``
95
+
91
96
`/**
`
92
``
`-
- Transform Vue SFCs into custom elements.
`
93
``
`` -
true: all*.vueimports are converted into custom elements
``
94
``
`` -
string | RegExp: matched files are converted into custom elements
``
95
``
`-
`
96
``
`-
- @default /.ce.vue$/
`
``
97
`` +
- @deprecated moved to
features.customElement.
``
97
98
` */
`
98
99
`customElement?: boolean | string | RegExp | (string | RegExp)[]
`
99
100
``
100
101
`/**
`
101
102
` * Use custom compiler-sfc instance. Can be used to force a specific version.
`
102
103
` */
`
103
104
`compiler?: typeof _compiler
`
``
105
+
``
106
`+
features?: {
`
``
107
`+
optionsAPI?: boolean
`
``
108
`+
prodDevtools?: boolean
`
``
109
`+
prodHydrationMismatchDetails?: boolean
`
``
110
`+
/**
`
``
111
`` +
- Enable reactive destructure for
defineProps.
``
``
112
`+
- Available in Vue 3.4 and later.
`
``
113
`+
- Defaults to true in Vue 3.5+
`
``
114
`+
- Defaults to false in Vue 3.4 (experimental)
`
``
115
`+
*/
`
``
116
`+
propsDestructure?: boolean
`
``
117
`+
/**
`
``
118
`+
- Transform Vue SFCs into custom elements.
`
``
119
`` +
true: all*.vueimports are converted into custom elements
``
``
120
`` +
string | RegExp: matched files are converted into custom elements
``
``
121
`+
`
``
122
`+
- @default /.ce.vue$/
`
``
123
`+
*/
`
``
124
`+
customElement?: boolean | string | RegExp | (string | RegExp)[]
`
``
125
`+
}
`
104
126
`}
`
105
127
``
106
128
`export interface ResolvedOptions extends Options {
`
`@@ -128,17 +150,18 @@ export default function vuePlugin(rawOptions: Options = {}): Plugin {
`
128
150
`root: process.cwd(),
`
129
151
`sourceMap: true,
`
130
152
`cssDevSourcemap: false,
`
131
``
`-
devToolsEnabled: process.env.NODE_ENV !== 'production',
`
132
153
`})
`
133
154
``
134
155
`const filter = computed(() =>
`
135
156
`createFilter(options.value.include, options.value.exclude),
`
136
157
`)
`
137
``
`-
const customElementFilter = computed(() =>
`
138
``
`-
typeof options.value.customElement === 'boolean'
`
139
``
`-
? () => options.value.customElement as boolean
`
140
``
`-
: createFilter(options.value.customElement),
`
141
``
`-
)
`
``
158
`+
const customElementFilter = computed(() => {
`
``
159
`+
const customElement =
`
``
160
`+
options.value.features?.customElement || options.value.customElement
`
``
161
`+
return typeof customElement === 'boolean'
`
``
162
`+
? () => customElement
`
``
163
`+
: createFilter(customElement)
`
``
164
`+
})
`
142
165
``
143
166
`return {
`
144
167
`name: 'vite:vue',
`
`@@ -175,10 +198,18 @@ export default function vuePlugin(rawOptions: Options = {}): Plugin {
`
175
198
`dedupe: config.build?.ssr ? [] : ['vue'],
`
176
199
`},
`
177
200
`define: {
`
178
``
`-
VUE_OPTIONS_API: config.define?.VUE_OPTIONS_API ?? true,
`
179
``
`-
VUE_PROD_DEVTOOLS: config.define?.VUE_PROD_DEVTOOLS ?? false,
`
``
201
`+
VUE_OPTIONS_API:
`
``
202
`+
(options.value.features?.optionsAPI ||
`
``
203
`+
config.define?.VUE_OPTIONS_API) ??
`
``
204
`+
true,
`
``
205
`+
VUE_PROD_DEVTOOLS:
`
``
206
`+
(options.value.features?.prodDevtools ||
`
``
207
`+
config.define?.VUE_PROD_DEVTOOLS) ??
`
``
208
`+
false,
`
180
209
`VUE_PROD_HYDRATION_MISMATCH_DETAILS:
`
181
``
`-
config.define?.VUE_PROD_HYDRATION_MISMATCH_DETAILS ?? false,
`
``
210
`+
(options.value.features?.prodHydrationMismatchDetails ||
`
``
211
`+
config.define?.VUE_PROD_HYDRATION_MISMATCH_DETAILS) ??
`
``
212
`+
false,
`
182
213
`},
`
183
214
`ssr: {
`
184
215
`// @ts-ignore -- config.legacy.buildSsrCjsExternalHeuristics will be removed in Vite 5
`
`@@ -196,8 +227,11 @@ export default function vuePlugin(rawOptions: Options = {}): Plugin {
`
196
227
`sourceMap: config.command === 'build' ? !!config.build.sourcemap : true,
`
197
228
`cssDevSourcemap: config.css?.devSourcemap ?? false,
`
198
229
`isProduction: config.isProduction,
`
199
``
`-
devToolsEnabled:
`
200
``
`-
!!config.define!.VUE_PROD_DEVTOOLS || !config.isProduction,
`
``
230
`+
devToolsEnabled: !!(
`
``
231
`+
options.value.features?.prodDevtools ||
`
``
232
`+
config.define!.VUE_PROD_DEVTOOLS ||
`
``
233
`+
!config.isProduction
`
``
234
`+
),
`
201
235
`}
`
202
236
`},
`
203
237
``