Parcel 2 + Vue 3 - 如何设置全局功能标志？ Vue 开发工具已禁用(Parcel 2 + Vue 3 - How to set global feature flags ? Vue

三水木雨

已于 2022-08-12 19:47:25 修改

阅读量1.5k

点赞数

分类专栏： vue 文章标签： vue.js javascript 前端

于 2022-08-12 17:03:23 首次发布

原文链接：https://www.likecs.com/ask-1082559.html

版权

vue 专栏收录该内容

35 篇文章 2 订阅

订阅专栏

1、问题描述：

使用 Vue.js v3 开始一个新项目。设置和启动一个不起眼的应用程序一切都很好，除了浏览器控制台中的这个警告：

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

【解决方案】：

方法是在您的应用程序条目 .js 文件的开头附近写下这段代码：

globalThis.__VUE_OPTIONS_API__ = true;
globalThis.__VUE_PROD_DEVTOOLS__ = false;

如果您希望在开发或生产中具有不同的价值，您可以利用 Parcel 的 node emulation feature，如下所示：

if (process.env.NODE_ENV === "development") {
   globalThis.__VUE_OPTIONS_API__ = true
   globalThis.__VUE_PROD_DEVTOOLS__ = true;
} else {
   // different values for production.
   globalThis.__VUE_OPTIONS_API__ = false;
   globalThis.__VUE_PROD_DEVTOOLS__ = false;
}ent values for production.