-
css- loader style-loader 处理css html文件
查看全部 -
三、https://www.npmjs.com中搜索html-webpack-plugin可以看到对插件的详细解释
四、path:输出的时候把所有文件都放到合格目录下
publicPath:占位符,需要上线,设置时,如果设置为http://cdn.com,这样js的路径就会替换为绝对地址以http://cdn.com开头的路径,这样就能满足上线需求了。
五、minify,对上线的html进行压缩查看全部 -
webpack基本配置
关于入口文件entry的配置
1、entry:'./src/main.js'
2、entry:['./src/main.js','./src/a.js']
3、entry:{main:'./src/main.js',a:'./src/a.js'}
关于出口文件output
output: {
path:'./dist/js', //打包文件放的位置
filename:'[name]-[hash].js' //打包后的文件名字
}
其中占位符有三种
[name]、[hash]、[chunkhash]
查看全部 -
css-loader作用是识别.css的文件
style-loader的作用 在文件中新建style标签,插入到文件中header标签中
自动打包更新命令
webpack hello.js hello.bundle.js --module-bind 'css=style-loader!css-loader' --watch
能看到自动打包的进程
webpack hello.js hello.bundle.js --module-bind 'css=style-loader!css-loader' --progress
看打包的模块的话
webpack hello.js hello.bundle.js --module-bind 'css=style-loader!css-loader' --progress --display-modules --display-reasons
查看全部 -
npm install webpack
查看全部 -
111111111111
查看全部 -
1、postcss-loader:浏览器兼容,给需要写兼容代码的样式添加前缀
2、loader是按照从右往左的顺序执行的
查看全部 -
配置文件方式,module:{loaders:【{}】}
查看全部 -
一。webpack的安装
1.新建个目录 mkdir webpack-demo
2.进入目录 cd webpack-demo
3.初始化 npm init
4.安装webpack npm i webpack --save-dev
二。 webpack打包
webpack 打包文件名 打包后的文件名 例如 webpack hello.js hello.bundle.js
三,webpack的参数
module-bind 给模块绑定loader 例如给css绑定style-loader!css-loader
watch 监听参数
process 打包过程参数
等等
四。webpack的配置文件 ----webpack.config,js
module.exports={
entry:'./src/script/main.js',
output:{
path:'.dist/js',
filename:'bundle.js'
}
}
--config的使用
查看全部 -
5+版本写法
查看全部 -
高版本webpack写法
查看全部 -
高版本webpack写法
查看全部 -
高版本webpack写法
查看全部 -
插圖時,沒有文字不能提交
查看全部 -
note 2
查看全部 -
test
查看全部
举报