webpack入门-01

index.html:

里面只有一个js文件，该文件是打包后生成的文件

main.js:

里面只有这一句话

 webpack.config.js:

 

 

里面的entry是打包时，js输入的路径，output是打包时输出的位置，其中path是输出的路径，

filename是输出的js文件，多个js输出时，这里可以写成数组的形式。

再如：

这里多了一个module，这个地方把图片，jsx,ts,es6，scss等等浏览器不能直接识别的文件进行处理，用什么处理呢？在loader里面可以看到对应文件所需要的loader，前提是node_modules文件夹里有相应的模块。如果没有，定下载。

• test：一个匹配loaders所处理的文件的拓展名的正则表达式（必须）

• loader：loader的名称（必须）

• include/exclude:手动添加必须处理的文件（文件夹）或屏蔽不需要处理的文件（文件夹）（可选）；

• query：为loaders提供额外的设置选项（可选）

 

 详情见：https://segmentfault.com/a/1190000006178770