Vue flags not working correctly

[rstoenescu]

Vue version

3.5.13

Link to minimal reproduction

https://github.com/rstoenescu/vue-flags-bug

Steps to reproduce

Please see the reproduction repo (a barebones Vitejs project folder): /vite.config.js for flags configuration and /src/App.vue for an Options API component.

define: {
  // No effect, it's still included
  __VUE_OPTIONS_API__: 'false',

  // Has the opposite effect: devtools will be enabled for prod builds!
  // Commenting this out will disable devtools in prod builds.
  __VUE_PROD_DEVTOOLS__: 'false',

  // Has the opposite effect: mismatch details will be included in prod builds!
  __VUE_PROD_HYDRATION_MISMATCH_DETAILS__: 'false'
},

1. Run yarn build then serve the /dist folder. App.vue, which is an Options API component runs fine and executes its Options API definition.
2. Run yarn build with vite.config.js > __VUE_PROD_DEVTOOLS__: 'false',. Serve the /dist folder and notice that Vue Devtools is available and running. Then again with the vite.config.js __VUE_PROD_DEVTOOLS__ line commented out. Notice that Vue Devtools is not available.

What is expected?

1. Options API to not be included when define > __VUE_OPTIONS_API__ is set to false.
2. Vue Devtools not to be available for production builds when define > __VUE_PROD_DEVTOOLS__ is set to false.
3. Hydration mismatches will still be available in production builds when define > __VUE_PROD_HYDRATION_MISMATCH_DETAILS__ is set to false.

What is actually happening?

Following the configuration from my reproduction repo:

1. Options API is still running fine. No build errors also.
2. Vue Devtools are available in production builds.
3. Hydration mismatches are still be available in production builds.

System Info

No response

Any additional comments?

No response

[KazariEX]

I'm not sure if it's related here.

https://github.com/vitejs/vite-plugin-vue/blob/bebb87b4b477e57d4801ad965659b28dc95e05bc/packages/plugin-vue/src/index.ts#L245-L248

[edison1105]

It's a vite-plugin-vue bug, see vitejs/vite-plugin-vue#480