在使用vue3开发聊天程序时, 因为在开发环境有特殊的数据控制界面, 在发布时需要屏蔽掉, 但是这些开发界面还是被打包了.
怎么避免开发环境的界面代码, 被打包? 即,dev组件相关的代码, 怎么避免被打包?
如果是在代码中使用静态import 是无法避免代码被打包的, 需要使用 vue 的动态组件component, 以及vite的define选项来解决.
vite 的 define: 定义全局常量替换方式。其中每项在开发环境下会被定义在全局,而在构建时被静态替换。
dev组件的截图:
dev组件代码被打包的处理图:
dev组件代码不被打包的处理图: