webpack入门

一·模块实现

1.下载依赖

npm install webpack@3.12.0 -D

2.创建man.js作为项目的入口文件

把文件打包到build.js

html引用build.js

命令:webpack ./main.js build.js 

还可以把命令写到packge.json(npm init --yes 是配置项目所需的运行和开发环境)文件中

输入npm run build也可以得到build.js文件

 

 

二webpack编译后build.js文件解读

webppack文档 https://www.webpackjs.com/configuration/module/

 

 

 

 

http://www.ruanyifeng.com/blog/2014/10/event-loop.html

 

三webpack.config.js文件配置

1.webpack.config.js  运行内容 webpack

 

 

 

2配置开发,生产环境 运行webpack --config ./webpack.dev.config.js

 

 

或者运行 npm run dev

 四css文件处理

css文件webpack需要loader去处理这些文件

下载并配置

npm i css-loader style-loader -D

 

 

 css文件引入需要加载loader

 

 

 

 

   

五图片文件处理

六html-webpack-plugin插件的使用

七webpack-dev-sever

八es6的解析

九单文件引入

 

posted @ 2020-08-04 00:19  逆流而上的酸菜鱼  阅读(91)  评论(0)    收藏  举报