Vue Devtools included in production bundle

[kendallroth]

What happened?

When generating a production build, it appears that some Vue Devtools code is included in the build (due to VeeValidate). This is unexpected, as in production any devtools-related code should not be included (to decrease bundle size, etc). While the docs mention that the devtools are not installed in production builds, they still appear to be imported/included in bundle?

Reproduction steps

1. Install and use vee-validate in a project
2. Install rollup-plugin-visualizer (configure with sourcemaps: true)
3. Build for production
4. Verify that devtools-kit/dist/index.js is included in build

Version

Vue.js 3.x and vee-validate 4.x

What browsers are you seeing the problem on?

• Firefox
• Chrome
• Safari
• Microsoft Edge

Relevant log output

No response

Demo link

Not reproducible in CodeSandbox (requires build environment)

Code of Conduct

• I agree to follow this project's Code of Conduct

[logaretm]

Good catch, I think while vee-validate's code gets dropped correctly, it still bundles in the devtools code because it is imported as a dependency.

I will experiment with maybe lazy loading it because i don't want to lose the ability to auto-install the devtools plugin whenever vee-validate is used.

[kendallroth]

Ah, gotcha, so VeeValidate's dev-tools related code was getting dropped, but just not the underlying (related) Vue devtools themselves...that makes a lot of sense (hadn't connected those dots before 🤦).

Agreed the the ability to auto-install the devtools plugin is super useful though; I really appreciate having the devtools integration ❤️!