Webpack
文章平均质量分 69
Webpack
Silly夏
英特纳雄耐尔夏
展开
-
Webpack Webpack打包文件配置基本使用
文章目录webpack1 概念1.0 webpack发展历史1.1 官方解释1.2 功能1.3 核心概念1.4 入口(entry)1.5 输出(output)1.6 loader1.7 插件(plugin)1.8 模式(mode)1.9 浏览器兼容性(browser compatibility)1.10 环境(environment)2 入口(entry)2.1 基本使用2.2 配置打包的入口和出口2.3 配置webpack的自动打包功能2.4 配置html-webpack-plugin生成预览界面2.5原创 2021-07-06 22:06:22 · 473 阅读 · 0 评论 -
Webpack 浅析webpack基础
文章目录webpack基础1 打包CSS1.1 打包逻辑1.2 打包LESS1.3 打包成独立的CSS文件1.4 添加样式前缀1.5 格式校验1.6 压缩CSS2 打包HTML3 打包JS3.1 打包3.2 JS格式校验4 打包图片5 打包字体6 资源模块(Assent Modules)7 开发服务器(Dev Server)5 打包字体6 资源模块(Assent Modules)7 开发服务器(Dev Server)webpack基础1 打包CSS1.1 打包逻辑非JS的文件打包,需要对应的lo原创 2021-07-06 22:05:08 · 187 阅读 · 0 评论 -
Webpack Webpack实践配置
文章目录1 实践1.1 初始化项目1.2 安装webpack1.3 创建入口文件1.4 执行打包(指定mode)2 webpack配置文件2.1 配置文件是用来简化命令行选项的2.2 配置文件名称是webpack.config.js2.3 配置详情1 实践1.1 初始化项目mkdir myproject && cd myproject && npm init -y1.2 安装webpack安装命令默认安装版本5npm install -D webpack原创 2021-07-06 22:04:20 · 86 阅读 · 0 评论 -
Webpack 浅析Webpack的几个核心概念
文章目录webpack核心概念1 入口2 出口3 加载器4 插件5 模式6 模块7 依赖图webpack核心概念入口(Entry)出口(Output)加载器(Loader)插件(Plugin)模式(Mode)模块(Module)依赖图(Dependency Graph)1 入口打包时,第一个被访问的源码文件。默认为src/index.js(可以配置)。webpack通过入口,加载整个项目的依赖。2 出口打包之后,输出的文件名称。默认为dist/main.js(可以配置原创 2021-07-06 22:03:45 · 132 阅读 · 0 评论 -
Webpack Webpack简介
webpack简介从本质上讲,webpack是一个现代的JavaScript应用的静态模块打包工具。模块(模块化开发,可以提高开发效率,避免重复造轮子)打包(将各个模块,按照一定的规则组装起来)官网:https://webpack.js.org/特点:功能强大(打包、构建、发布web服务)学习成本高功能有好的模块化支持。合并打包多个文件,减少http请求次数,提高效率。编译代码,确保浏览器兼容性。压缩代码,减少文件体积,提高加载速度。监测代码格式原创 2021-07-06 22:01:50 · 247 阅读 · 0 评论