Question

我的项目使用lodash.js库。我需要将我的项目添加到另一个使用underscore.js库的项目中。这使我在这两个库之间出现冲突错误。

我尝试写这个，但它没有改变任何东西：

<script src="/web/externals/underscore/underscore.js"></script>
<script src="/web/externals/lodash/lodash.js"></script>

<script>
    window.lodash = _.noConflict();
    window.underscore = _.noConflict();
</script>

<app-root></app-root>
<script type="text/javascript" src="/etc/inline.bundle.js"></script>
<script type="text/javascript" src="/etc/polyfills.bundle.js"></script>

////////// EDIT ////////

<script src="/web/externals/underscore/underscore.js"></script>
<script src="/web/externals/lodash/lodash.js"></script>

<script>
    var lodash = _.noConflict()
</script>

<app-root></app-root>
<script type="text/javascript" src="/etc/chat/inline.bundle.js"></script>
<script type="text/javascript" src="/etc/chat/polyfills.bundle.js"></script>

Answer 1

要在这种情况下使用noConflicts，您需要导入一个库，使用_.noConflicts，然后导入另一个库。例如：

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.js"></script>
<script>
    window.lodash = _.noConflict();
</script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<script>
    window.underscore = _.noConflict()
</script>
  

<script>
    console.log("Lodash version is " + lodash.VERSION)
    console.log("Underscore version is " + underscore.VERSION) 
</script>

＆＃13;

但是，FWIW可能值得考虑将您的应用与webpack等内容捆绑在一起。这将允许每个人拥有自己的依赖版本，而无需争夺全球范围。

Answer 2

你只需要调用一次noConflict，你也不需要改变窗口对象（虽然你可以完全没必要）。复制以下代码，将其放入HTML文件，将其加载到您喜欢的浏览器中并检查控制台。你会发现它没有任何冲突

<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.4/lodash.min.js"></script>
<script>
    var __ = _.noConflict();
</script>

<script src="http://underscorejs.org/underscore-min.js"></script>
<script>
  var string = 'test';
  var array = ['1', '2', '3'];

  //starts with is a lodash function
  console.log(__.startsWith(string, 't'));

  //shuffle is an underscore function
  console.log(_.shuffle(array));
</script>

您可以根据需要为lodash变量命名，并将下划线保留为_

如果您希望将lodash保留为_并重命名下划线，只需交换2个脚本的加载顺序

 <script src="http://underscorejs.org/underscore-min.js"></script>
<script>
    var __ = _.noConflict();
</script>

<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.4/lodash.min.js"></script>
<script>
  var string = 'test';
  var array = ['1', '2', '3'];

  console.log(_.startsWith(string, 't'));
  console.log(__.shuffle(array));
</script>

如果这对您不起作用，那么还有其他问题，您需要发布更多代码。

冲突库lodash.js和underscore.js

2 个答案: