Webpack 从入口文件导入，在 dist/index.html 中不可用

Question

我在 index.js 中有导入

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

Vue.use(axios);

export {$, Vue};

然后在我的 dist 文件夹中，我有一个 index.html 加载 webpack 输出的 main.js 文件

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

明明我可以访问 window.Vue，但为什么我不能只访问 Vue？

我是 webpack 的新手。我有什么需要做的吗？

Answer 1

export 不会隐式地使属性在全局范围内可用，它允许它们在其他地方被imported。如果您想将$ 和Vue 附加到窗口，则需要在index.js 中明确执行此操作。

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