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不会隐式地使全局 scope 中的属性可用，它允许它们在其他地方import 。 如果您希望将$和Vue附加到 window，您需要在index.js中明确执行此操作。

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