使用webpack打包脚本文件
众所周知，webpack是一款很火的模块打包工具，它能静态的分析出模块之间的依赖情况，从对静态资源进行打包
1.首先，确认你的电脑已装好node和npm,安装过程这里就不做描述，可参考相关文档
2.新建一个文件夹，命名随意，在新建的文件夹中新建一个配置文件webpack.config.js
3.安装项目的依赖
进入这个目录，执行npm i -D webpack
i就是install的意思， -D就是- -save-dev
4.然后新建一个文件夹src, src中放的是源文件，新建 app.js作为入口文件，初始化我们的项目，执行npm init
生成package.json,例如：
注意若生成的package.json 无上图中第一个红框命令，手动添加此命令"dev": "webpack"
第二处若生成的为"Dependencies": {
"webpack": "^3.8.1"
},改为图中
"devDependencies":{
"webpack": "^3.8.1"
},
5. 更改webpack.config.js文件
新建一个dist文件夹，存放输出文件,修改我们的webpack.config.js
首先引入path
entry为入口文件
output为打包出口， filename打包好的文件叫什么名字，我们可以叫main.js
path打包到哪个地方,注意这块是绝对路径 dist/output 若无output文件夹打包时会自动创建
path.resolve(__dirname,'dist/output')
6.然后我们添加一些代码，新建文件夹 components ，在新建的文件夹中新建test.js
然后我们在app.js中引入这个文件
此时我们的目录结构为：
然后我们就可以对我们的脚本进行打包啦， 运行npm run dev
打包成功后，去我们的dist文件夹，就可以看到我们打包好的js文件啦
