webpack基本配置说明

npm 初始化目录：输入命令npm init

②安装webpack --save-dev

③建立文件夹 src 放代码源文件 dist目录打包项目静态资源 建立index.html

④在index.html中引入打包后的js文件，建立style文件 放css

⑤新建文件名为webpack.config.js的文件，该文件为webpack的默认配置文件，运行时会自动查找

语法：module.exports = {// configuration};

例，基本配置：

module.exports={

entry:{

app:'./src/app.js'

},//入口文件

output:{

path:__dirname + '/build',

filename:'js/[name].js'

}//出口文件

}

========package.json文件==========

npm的属性script

在属性里面定义一个脚本的内容

可以是真是的webpack命令，这里自定义一个webpack脚本

"scripts":{

"test":"echo\"Error: no test specified\"&& exit 1",

"webpack":"webpack --config webpack.config.js --progress --display-modules --colors --display-reason"

},

其中--progress命令参数显示进度 在webpack处理css文件以及一些高级命令行参数已说明

运行npm run webpack即可运行

==========================

webpack配置文件的 入口参数

entry,可以写成

entry:[ "./entry1","./entry2"]两个不相依赖的入口文件

也可以写成对象形式

entry:{

main:'./main',

a:'./a'

}

由于有两个入口，output就不能做相对路径要改成：

output:{

path:'./dist/js',

filename:'[name]-[chunkhash].js'  //chunkhash为文件的md5值具有唯一性，只有在有修改时才会改变。

}

相关可以查看官方文档：http://webpack.github.io/docs/configuration.html