webpack入门

06d4d6ebfb226c3095384a623be5067f.png1.webpack用途

打包合并依赖文件
2.webpack优势
  是基于内存,哪个文件变了,单独编译哪个文件
3.webpack安装
npm i webpack -g
4.webpack使用
webpack 入口文件 输出文件
5.webpack 监视文件变化 自动化
webpack 入口文件 输出文件 --watch
6.webpack配置文件
新建文件:webpack.config.js
里面是node代码

module.exports={
entry:'./entry.js',
output:{
path:__dirname,
filename:'bundle.js'
}
}

7.安装webpack-dev-server
npm install webpack-dev-server -g
8.使用webpack-dev-server
命令行webpack-dev-server
9.webpack dev server
提供热更新服务,当js文件
发生变化时自动重新编译,并且刷新页面
10.转换器
webpack默认只能载入原生的js文件
使用:下载转换器
npm install css-loader style-loader
引用:require('!style!css!./xxx.css')

posted @ 2022-05-31 18:11  青年码农  阅读(18)  评论(0编辑  收藏  举报