在 Laravel 中将 JS 添加到 app.js 时未捕获的 ReferenceError答案

【问题标题】：Uncaught ReferenceError when adding JS to app.js in Laravel在 Laravel 中将 JS 添加到 app.js 时未捕获的 ReferenceError
【发布时间】：2021-08-20 13:50:24
【问题描述】：

我有一些使用函数detect.js 的浏览器嗅探器代码。未添加到我的项目时它工作正常。不过，当我尝试编译 JavaScript 并将其添加到 app.js 时，我在控制台的下面第一行收到错误，刷新浏览器并检测浏览器版本。

未捕获的 ReferenceError：未定义 forEach。

// Each Utility
var each = forEach = function (obj, iterator, context) {
    if (obj == null) return;
    if (nativeForEach && obj.forEach === nativeForEach) {
        obj.forEach(iterator, context);
    } else if (obj.length === +obj.length) {
        for (var i = 0, l = obj.length; i < l; i++) {
            iterator.call(context, obj[i], i, obj);
        }
    } else {
        for (var key in obj) {
            if (_.has(obj, key)) {
                iterator.call(context, obj[key], key, obj);
            }
        }
    }
};

似乎编译 JavaScript 正在对其进行处理。有什么建议吗？

【问题讨论】：

Detect.js 最后一次更新是在 2015 年。你不应该在 2021 年使用它。
你需要浏览器在这里嗅探什么？我们或许可以推荐替代品。
npm 可能会限定变量的范围。查看生成的文件。请改用window.forEach = function() { ...。
好点 AKX - 我正在寻找检测浏览器 npmjs.com/package/detect-browser 作为选项
获得与检测浏览器（索引）类似的问题：300 Uncaught ReferenceError: require is not defined

标签： javascript laravel npm laravel-mix browser-detection

【解决方案1】：

如果我使用detect-browser 包。

npm i detect-browser

然后将以下内容添加到我的 app.js...

const { detect } = require('detect-browser');
const browser = detect();

try {
    // handle the case where we don't detect the browser
    if (browser) {
        console.log(browser.name);
        console.log(browser.version);
        console.log(browser.os);
    } else {
        console.log('no browser');
    }
} catch (e) {
    console.log(e);
}

并发出npm run prod...

当我打开页面时，我在控制台中看到以下内容（没有错误）。

【讨论】：

我确定是这样，但问题一定是与其他 js 或我的 laravel-mix 设置中的 javascript 的 webpack 压缩冲突。