vue
Which dist file to use?
-
vue.global(.prod).js: -
*vue(.runtime).esm-bundler.js:- For use with bundlers like
webpack,rollupandparcel. - Leaves prod/dev branches with
process.env.NODE_ENVguards (must be replaced by bundler) - Does not ship minified builds (to be done together with the rest of the code after bundling)
- imports dependencies (e.g.
@vue/runtime-core,@vue/runtime-compiler)- imported depdencies are also
esm-bundlerbuilds and will in turn import their dependencies (e.g.@vue/runtime-coreimports@vue/reactivity) - this means you can install/import these deps individually without ending up with different instances of these dependencies.
- imported depdencies are also
vue.runtime.esm-bundler.js: runtime only, does not include runtime template compilation support. This is the default entry for bundlers (viamodulefield inpackage.json) because when using a bundler templates are typically pre-compiled (e.g. in*.vuefiles).vue.esm-bundler.js: includes the runtime compiler. Use this if you are using a bundler but still want runtime template compilation (e.g. in-DOM templates or templates via inline JavaScript strings).
- For use with bundlers like
-
vue.esm(.prod).js:- For usage via native ES modules imports (in browser via
<script type="module">, or via Node.js native ES modules support in the future) - Inlines all dependencies - i.e. it's a single ES module with no imports from other files
- this means you must import everything from this file nad this file only to ensure you are getting the same instance of code.
- Hard-coded prod/dev branches, and the prod build is pre-minified (you will need to use different files for dev/prod)
- For usage via native ES modules imports (in browser via
-
vue.cjs(.prod).js:- For use in Node.js server-side rendering via
require(). - The dev/prod files are pre-built, but are dynamically required based on
process.env.NODE_ENVinindex.js, which is the default entry when you dorequire('vue').
- For use in Node.js server-side rendering via