一、live-server服务器介绍：
上节课我们用了live-server这个服务器，那这里就给大家介绍一下:live-server是一款简单的开发用的Http服务器。特点就是在你静态文件进行修改后，有自动加载的功能。
使用它主要有两个原因：
1、对Ajax的操作必须要有服务器的支持，比如用javascript去获取内容。
2、浏览器的自动更新，可以加快开发。你不需要安装任何浏览器插件或手动添加代码片段到您的网页代码里。
安装方法上一节我们已经介绍过了，这里就不重复介绍了。
二、webpack配置多路口文件
当我们需要时webpack 是允许我们有多个输出文件的。也就是说，我们可以在html文件中引入2个js文件或者其他的文件。
我们来做个多入口文件的例子：
1、首先我们建立两个JavaScript文件，分别是main1.js 和main2.js。然后在里边输出 Hello world 和 Hello webpack 。
main1.js
| 1 | document.write("<h1>Hello World!</h1>"); |
main2.js
| 1 | document.write("<h2>Hello Webpack!</h2>"); |
2、建立indx.html文件，引入bundle1.js和bundle2.js，这两个文件就是我们要打包的两个js文件。
index.html
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | <!DOCTYPE html> <html lang="en">
<head> <title>webpack example02</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body> <script type="text/javascript" src="./bundle1.js"></script> <script type="text/javascript" src="./bundle2.js"></script> </body>
</html> |
3、建立webpack.config.js配置文件。
| 1 2 3 4 5 6 7 8 9 | module.exports = { entry: { bundle1: './main1.js', bundle2: './main2.js' }, output: { filename: '[name].js' } }; |
1955
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
