• ES2015模块导入：
    1. import * as webpackNumbers from 'webpack-numbers';
    2. // ...
    3. webpackNumbers.wordToNum('Two');
    • CommonJS模块需要：
    1. var webpackNumbers = require('webpack-numbers');
    2. // ...
    3. webpackNumbers.wordToNum('Two');
    • AMD模块要求：
    1. require(['webpackNumbers'], function ( webpackNumbers) {
    2.   // ...
    3.   webpackNumbers.wordToNum('Two');
    4. });
    • 通过脚本标签加载库：
    1. <!doctype html>
    2. <html>
    3.   ...
    4.   <script src="https://unpkg.com/webpack-numbers"></script>
    5.   <script>
    6.     // ...
    7.     // Global variable
    8.     webpackNumbers.wordToNum('Five')
    9.     // Property in the window object
    10.     window.webpackNumbers.wordToNum('Five')
    11.     // ...
    12.   </script>
    13. </html>

    例外处理:

    1. import _ from 'lodash';
    2. import numRef from './ref.json';
    4. export function numToWord(num) {
    5.   return _.reduce(numRef, (accum, ref) => {
    6.     return ref.num === num ? ref.word : accum;
    7.   }, '');
    8. }
    10. export function wordToNum(word) {
    11.   return _.reduce(numRef, (accum, ref) => {
    12.     return ref.word === word && word.toLowerCase() ? ref.num : accum;
    13.   }, -1);
    14. }
    1. [
    2.   {
    3.     "num": 1,
    4.     "word": "One"
    5.   },
    6.   {
    7.     "num": 2,
    8.     "word": "Two"
    9.   },
    10.   {
    11.     "num": 3,
    12.     "word": "Three"
    13.   },
    14.   {
    15.     "num": 4,
    16.     "word": "Four"
    17.   },
    18.   {
    19.     "num": 5,
    20.     "word": "Five"
    21.   },
    22.   {
    23.     "num": 0,
    24.     "word": "Zero"
    25.   }
    26. ]
    1. var path = require('path');
    3.   module.exports = {
    4.     entry: './src/index.js',
    5.     output: {
    6.       path: path.resolve(__dirname, 'dist'),
    7.       filename: 'webpack-numbers.js'
    8.     },
    9. +   externals: {
    10. +     lodash: {
    11. +       commonjs: 'lodash',
    12. +       commonjs2: 'lodash',
    13. +       amd: 'lodash',
    14. +       root: '_'
    15. +     }
    16. +   }
    17.     // externals: {
    18.     //    react: 'React',
    19.     //    'react-dom': 'ReactDOM',
    20.     //    'react-router': 'ReactRouter',
    21.     //    lodash: '_',
    22.     //    d3: 'd3',
    23.     //    echarts: 'echarts',
    24.     //    moment: 'moment',
    25.     // },
    26.   };
    1. // webpack.config.js
    3.   var path = require('path');
    5.   module.exports = {
    6.     entry: './src/index.js',
    7.     output: {
    8.       path: path.resolve(__dirname, 'dist'),
    9.       filename: 'webpack-numbers.js',
    10. +     library: 'webpackNumbers',
    11. +     libraryTarget: 'umd'
    12.     },
    13.     externals: {
    14.       lodash: {
    15.         commonjs: 'lodash',
    16.         commonjs2: 'lodash',
    17.         amd: 'lodash',
    18.         root: '_'
    19.       }
    20.     }
    21.   };

    您可以通过以下方式公开库：

    • 变量：作为scripttag（libraryTarget:'var'）提供的全局变量。
    • 这个：通过thisobject（libraryTarget:'this'）获得。
    • 窗口：window在浏览器（libraryTarget:'window'）中通过对象可用。
    • UMD：在AMD或CommonJS require（libraryTarget:'umd'）之后可用。

    如果library已设置libraryTarget且未设置，则libraryTarget默认var为输出配置文档中指定的值。见output.libraryTarget那里的所有可用选项的详细列表。

    output.libraryTarget一共支持的值：

    1. var - 默认值
    2. assign
    3. this
    4. window
    5. global
    6. commonjs
    7. commonjs2
    8. amd
    9. umd
    10. jsonp