Question

我正在使用React和Redux。在我的Reducer内部，我正在使用lodash库。

debugger;命令停止执行

如果我导入lodash库

import _ from "../../node_modules/lodash";

或

import _ from "lodash";

失败。它无法导入库。运行我的React应用程序时没有加载错误。我想知道如何在Google Chrome控制台中加载外部库（即lodash）？

Answer 1

使用动态导入语法代替，您将获得所需的Promise。例如，在此页面上：

https://stackoverflow.com/questions/57032914/loading-external-library-in-chrome-console

使用

import('../../foo')

产生

假设在您自己的站点上链接正确，那么您只需在Promise上致电.then：

import("../../node_modules/lodash")
  .then((_) => {
    // do stuff with _
  });

（当然，这要求node_modules是当前页面的祖父母目录的子文件夹）

Answer 2

我发现的最简单的方法是：

将下面的html复制到文件中，并将其另存为.html文件（例如-testLodash.html）。它可以用于任何其他库，只需将库的CDN放入script标记中即可。
在浏览器中打开文件（在我的情况下为Chrome）-打开空白页。
打开浏览器控制台并开始使用它。例如_.groupBy([6.1, 4.2, 6.3], Math.floor)。控制台日志{4: Array(1), 6: Array(2)}

<html>
   <head>
      <meta charset=utf-8 />

   </head>

   <body>
      <script src="https://cdn.jsdelivr.net/lodash/4/lodash.min.js"></script>

   </body>
</html>

在Chrome控制台中加载外部库

2 个答案: