799446817

导航

简易webpack 入门

webpack 模块打包机
作用:将浏览器不识别的语言转化成浏览器识别的语言
工作流程
通过一个入口文件 找到这个入口文件所依赖的所有模块,将这些文件打包成一个或多个文件
如何使用:
1、安装
cnpm i webpack@3.5.3 -g (全局)

2、 a、初始化仓库 npm init -y
b、cnpm i webpack@3.5.3 --save-dev(局部安装,只需要在使用webpack的文件夹中安装即可)
3、创建一个文件 webpack.config.js //配置文件
4、 安装 一些包
a、首先安装这些包 npm一次性安装多个依赖模块,模块之间用空格隔开
   npm install --save-dev @babel/core babel-loader @babel/preset-env @babel/preset-react
 
   b、处理css的loader
npm install --save-dev style-loader css-loader sass-loader node-sass
5、 使用插件plugin
cnpm i html-webpack-plugin --save-dev //作用帮我们生成一个与src平及的模板
6/创建服务器 热更新
cnpm i webpack-dev-server@2 --save-dev

posted on 2019-01-23 10:13  799446817  阅读(97)  评论(0编辑  收藏  举报