前提：
安装完webpack以及webpack-dev-server
参照
添加代码：
1.首先在目录demo下创建一个js文件：webpack.config.js
并初始化它的内容：
var config = {
};
module.exports = config;2.然后在package.json中添加一个快速启动webpack-dev-server服务的脚本：
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dev": "webpack-dev-server --open --config webpack.config.js"
},当运行:npm run dev 时，就会执行webpack-dev-server --open --config webpack.config.js 命令
--config是指向webpack-dev-server读取的配置文件路径，这里直接读取我们上面建的webpack.config.js文件.
--open会在执行命令时自动在浏览器打开页面，默认是127.0.0.1:8080，但是IP已经端口都是可以配置的。
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dev": "webpack-dev-server --host 172.172.172.1 --post 8888 --open --config webpack.config.js"
},3.webpack配置中最重要的也是必选的两个是入口（Entry）和出口（Output）,
入口的作用是告诉webpack从哪里开始寻找依赖，并且编译，
出口则是用来配置编译后的文件存储位置和文件名。
在demo目录下新建一个空的main.js作为入口的文件，然后在webpack.config.js中进行入口和输出的配置:
var path = require('path');
var config = {
entry:{
main:'./main'
},
output:{
path:path.join(__dirname,'./dist'),
publicPath:'/dist/',
filename:'main.js'
}
};
module.exports = config;entry中的main就是我们配置的单入口，webpack会从main.js文件开始工作。
output中path选项用来存放打包后的文件的输出目录，是必填项。
publicPath指定资源文件引用的路径，如果你的资源存放在CDN上，这里可以填CDN的网址。
filename用于指定输出文件的名称。
这里配置的output意思为：打包后的文件会存储为demo/dist/main.js文件，只要在html中引入它就可以了。
4.在demo目录下，新建一个index.html作为我们的入口：
<!DOCTYPE HTML>
<html>
<head>
<title> hello webpack </title>
<meta charset="utf-8">
</head>
<body>
<div id="app">
Hello Webpack!!!!!!
</div>
<script type="text/javascript" src="/dist/main.js"></script>
</body>
</html>
启动webpack工程
在此处打开命令行，输入：
npm run dev
就会在浏览器中打开页面了：
