webpack 第二部分

Posted 2022-04-16 shangjun6

　　默认根目录　　当前项目

　　修改目录　　devServer

　　devServer:

　　　　open:true,　　//自动打开浏览器

　　　　port:3000,　　// 端口

　　　　contentBase:"dist",　　　　// 配置服务的根目录

　　　　hotOnly:true　　　　// 重新加载但是不刷新页面（但是我没成功。。。）

　　

　　loader　　解析过程中所依赖的包

　　css 解析的包　　style-loader　　css-loader

　　我们的写法尽量采用这种，方便传参

　　module.exports=　　　

　　　　rules: [
　　　　　　
　　　　　　　　test: /\.css$/i,
　　　　　　　　use:[
　　　　　　　　　　　　
　　　　　　　　　　　　　　loader:"style-loader"
　　　　　　　　　　　　,
　　　　　　　　　　　　
　　　　　　　　　　　　　　loader:"css-loader"　　　　// 就比如我想在这传递参数，也方便

　　　　　　　　　　　　　　options:
　　　　　　　　　　　　
　　　　　　　　]
　　　　　  　　

　　　　　   ]

　　

　　less 需要的包  less 　　less-loader　　// 在 npm 官网查看方法

　　es6 需要的包　　babel-loader　　@babel/core　　@babel/prevet-env

　　关于图片背景　　file-loader　　这个就是好东西，不要下 url-loader 和 img-loader 太恶心，他的功能就完全可以代替他们