使用别名从 CDN 加载外部库

Load external library from CDN under an alias

我需要从 CDN 加载同一个库的两个版本。有没有办法在 window 上指定结果对象的名称，以免它们发生冲突？或者我可以在加载第二个之前重命名第一个吗？

<script src="lib@1" />
<script> window.lib1 = window.lib; </script>
<script src="lib@2" />

然后

window.lib1 // is lib@1
window.lib  // is lib@2

基于Jonas Wilms'的回答，我在使用webpack时想到了这两个解决方案，我在原问题中没有提到。

这是一个演示 https://codesandbox.io/s/multiple-library-versions-kvg5d

webpack - externals

  • 更新包时必须更改 webpack 配置 
module.exports = {
  externals: {
    react: 'React16_11'
  }
};

在代码中

import React from 'react' // webpack translates to window.React16_11

webpack - *

  • 更新包时必须更改项目中的 .js 文件
module.exports = {
  alias: {
    react$: './getReactFromWindow',
  },
};

getReactFromWindow.js:

 module.exports = window.React16_11;

在代码中

import React from 'react' // webpack translates to './getReactFromWindow'

*基于

的webpack别名