Webpack imports from entry file, not available in dist/index.html

Question

I have imports in index.js

import Vue from 'vue';
import axios from "axios";
import jQuery from "jQuery";
window.Vue = Vue;
var $ = jQuery;

Vue.use(axios);

export {$, Vue};

Then in my dist folder i have an index.html loading the main.js file that webpack outputs

   <div id="app">
        
   </div>
   <script src="main.js"></script>
   <script>
    console.log(Vue);
    console.log(window.Vue);
   </script>

Obviously I have access to window.Vue, but why don't I have access to just Vue?

Im new to webpack. Is there something i need to do?

Answer 1

export doesn't implicitly make properties available in the global scope, it allows them to be import ed elsewhere. If you want $ and Vue attached to the window, you need to do that explicitly in index.js .

window.Vue = Vue;
window.$ = $;