为什么我用 Laravel 得到未定义的 JS？

Question

我正在使用 Laravel 并且在我的 bootstrap.js 文件中有

window.ProgressBar = require('progressbar.js');

然后我需要 bootstrap.js 文件到 app.js

require('./bootstrap');

我用webpack.mix.js编译

mix.js('resources/assets/js/app.js', 'public/js')

如果我尝试访问 app.js 内部的 progressbar.js，它会完美运行。

但是，如果我试图在我页面上 app.js 之后的脚本标记 中的 app.js 之外使用它，ProgressBar是 undefined.

如何在我的 app.js 之外访问 ProgressBar 但保持通过 app.js 导入它？

示例 index.blade.php

<script src="app.js" defer></script> <script> const progress = new ProgressBar; //undefined... </script>

Answer 1

我认为，Webpack 对您隐藏了 ProgressBar，即使您已将 ProgressBar 分配给 window。因为你知道，Webpack 认为 bundle 包含你应用程序的所有代码。解决方案？不要捆绑它！而是使用 ProgressBar 的缩小版本，然后像过去一样加载它。完全没问题，好几纳秒或几纳秒，不明显。

Answer 2

我在脚本标签上设置了 defer，但由于某种原因导致它无法正常工作。

解决方案：

<script src="app.js" defer></script>

改为

<script src="app.js"></script>

为什么我用 Laravel 得到未定义的 JS？

Why do I get undefined JS with Laravel?

javascript

laravel

ecmascript-6

laravel-mix