webpack 引入未模块化的本地js / 引入Aliplayer和AliPlayerComponent

需求

在webpack配置的项目编写过程中，有时候需要引入未模块化的配置文件或第三方插件文件等js文件。
但webpack是根据模块化打包的，所以用普通的import是行不通的，在此提供我的解决方案，以阿里云播放器AliPlayer为例。

项目结构（已简化）

-webpack.common.js
-src
 -js
  -aliplayer-min.js
  -aliplayercomponents.js
 -pages
  -live.js

目标是在live.js中引入阿里云播放器相关的js静态文件。

代码实例

1. 首先安装需要用到的loader：
   npm i exports-loader script-loader -D

2. webpack.common.js

// webpack.common.js
      {
        test: require.resolve('./src/js/aliplayer-min.js'),
        loader: 'exports-loader?window.Aliplayer!script-loader'
      },
      {
        test: require.resolve('./src/js/aliplayercomponents.js'),
        loader: 'exports-loader?window.AliPlayerComponent!script-loader'
      }

3. live.js

require("exports-loader?window.Aliplayer!../js/aliplayer-min");
require("exports-loader?window.AliPlayerComponent!../js/aliplayercomponents");

4. 完成！重新运行项目查看效果。