javascript - Quasar VUE_PROD_HYDRATION_MISMATCH_DETAILS is not defined - Stack Overflow

admin管理员组

文章数量:1297026

Im using quasar together with Vite. After installing quasar with yarn create quasar I get the following warning in the console.

__VUE_PROD_HYDRATION_MISMATCH_DETAILS__ is not explicitly defined.
 You are running the esm-bundler build of Vue, which expects these 
pile-time feature flags to be globally injected via the bundler 
config in order to get better tree-shaking in the production 
bundle.

How can I get rid of it? I cannot find any information on where I shall define this in Quasar Framework

Im using quasar together with Vite. After installing quasar with yarn create quasar I get the following warning in the console.

__VUE_PROD_HYDRATION_MISMATCH_DETAILS__ is not explicitly defined.
 You are running the esm-bundler build of Vue, which expects these 
pile-time feature flags to be globally injected via the bundler 
config in order to get better tree-shaking in the production 
bundle.

How can I get rid of it? I cannot find any information on where I shall define this in Quasar Framework

• javascript
• vue.js
• vuejs3
• vite
• quasar-framework

Share Improve this question Follow asked Jan 5, 2024 at 16:52 acrosceneacroscene 1,06744 gold badges2222 silver badges5454 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 11

This warning starts appearing after upgrading to Vue 3.4 without upgrading all other required dependencies, namely @vitejs/plugin-vue, which should be upgraded to ^5.0.0. This is documented under Potential Actions Needed when upgrading to Vue 3.4.

With Quasar, you can not upgrade this package directly since it's not a top-level dependency of Quasar projects. Until the Quasar team releases an update, you will need to set the flag yourself

quasar.config.js

build: {
  extendViteConf(viteConf) {
    viteConf.define.__VUE_PROD_HYDRATION_MISMATCH_DETAILS__ = false
  },
}

本文标签： javascriptQuasar VUEPRODHYDRATIONMISMATCHDETAILS is not definedStack Overflow