webpack学习（二）

下面主要做一个示例，来说明当有多个js文件的时候，如何打包。

我们还是建立如下的目录及内容：

图1：文件夹结构

*index.html*
<!DOCTYPE html>
<html>
    <body>
        <title>webpack初试</title>
        <meta charset="utf-8">
        <script type="text/javascript" src="bundle.js"></script>
    </body>
    <body>
        
    </body>
</html>

*subMethod.js*
function tryStr() {
    return '这是webpack第二次尝试，目的是多个依赖文件的打包'
}
module.exports = tryStr

*main.js*
var tryStr = require('./subMethod.js')
document.write(tryStr())

其中，subMethod.js里面是一个tryStr方法，返回一个字符串，然后将这个方法export出去。
在main.js中引入subMethod.js,并且调用tryStr方法让其内容显示在界面上。

b、然后我们运行在控制台运行webpack main.js bundle.js后，文件夹中会生成bundle.js，并且运行index.html会出现如下结果:

图2：命令行打包

图3：index.html运行结果

这里只是一个简单的例子，大家可以拓展一下，比如添加json串的子方法,添加更多的依赖关系文件，去做更多的尝试。我也在学习中，共勉。
下一节一起学习样式的打包。