webpack之開發環境development

一，loader加載器
1，image-webpack-loader
(1)目的：對圖片image和svg等文件進行壓縮，
(2)流程：經過image-webpack-loader,打包後就會壓縮，文件體積就會少上不少。
vue-cli3.x的配置以下：
`
config.module
.rule('images')//開啓圖片壓縮
.test(/.(png|jpe?g|gif)(?.*)?$/)
.use('image-webpack-loader')
.loader('image-webpack-loader')
.options({ bypassOnDebug: true })
config.module
.rule('svg')//開啓svg壓縮
.test(/.(svg)(?.*)?$/)
.use('image-webpack-loader')
.loader('image-webpack-loader')
.options({ bypassOnDebug: true })
`
*使用過程注意點：
須用cnpm安裝(由於該插件註冊表在cnpm，·https://developer.aliyun.com/mirror/npm/package/image-webpack-loader),若是用過yarn和npm安裝過，記得卸載，而後再用cnpm安裝；