自定义Library

什么是Library
最初接触webpack时，总是不明白entry入口使用的Javascript和打包后的Library有什么区别？后来才明白，两者并无区别，任何的js模块都可以打包成一个library。

如何打包一个Library
最简单的方式，是在webpack.config.js中添加output的配置，如下：

        output:{
                ...
            library: 'myUtil',
            libraryTarget: 'umd'
        }

library & libraryTarget
那么这两个参数有什么意思呢？较详细的说明，见官方文档.此处只讲常用的配置。

• libraryTarget: 想创建一个library，output中的libraryTarget是必须不可少的。其代表，你将生成的library遵守的哪种规范，如commonJS,AMD,commonJS2。我不有关心这些乱七八糟的规范，我想弄个通用的，那么就设置为umd即可。

• library:假设你的library已生成完毕，且命名为main.js后(如下main.js是我自定义的library)!
  该变量值在使用import 或 require引入你的library时没有用。引入后的变量名可随意设置。如：

    import  * as myUtilx from './main'
  

  或

    var myUtilx = require('./main');
  

  它只有在html中，通过script标签引入library时才有用,如：

    <script src="main.js"></script>
  

此时获取你的library引用的以下三种方法均要使用此变量值（官方用词为"暴露你的library"）

        console.log(myUtil);
        console.log(this['myUtil']);
        console.log(window["myUtil"]);

此处的myUtil即是你配置在webpack.config.js中设置的library值。