随笔分类 - webpack
摘要:前言 1.webpack 只能理解 JavaScript 和 JSON 文件,这是 webpack 开箱可用的自带能力。loader 让 webpack 能够去处理其他类型的文件,并将它们转换为有效 模块,以供应用程序使用,以及被添加到依赖图中。 2.loader 支持链式调用。链中的第一个 loa
阅读全文
摘要:本文只是一个问题的记录,并不适合初学者的学习 在webpack4中使用postcss+autoprefixer,为样式添加前缀 第一种方法,在配置文件中配置postcss和autofixer,并配置适配浏览器范围 //style { test: less_re, use: [ MiniCssExtr
阅读全文
摘要:webpack.config.js const path = require("path");//不同的系统上对于,路径的定义是不一样的,使用path模块可以避免这些差异带来的影响 const join = function (url) {//定义一个路径拼接程序 return path.join(
阅读全文
摘要:前言 webpack拥有海量的拓展插件,这里对前端开发中常用的插件做一个记录 常用插件 处理ts awesome-typescript-loader //ts 处理loader source-map-loader //调试工具 typescript //typescript 核心编译工具,这是ts提
阅读全文
摘要:开发环境(development)和生产环境(production)的构建目标差异很大。在开发环境中,我们需要具有强大的、具有实时重新加载(live reloading)或热模块替换(hot module replacement)能力的 source map 和 localhost server。而
阅读全文
摘要:在开始上代码之前,先让我们盘一盘什么是webpack中的入口和输入 入口 假设你现在手里有一个水龙头,然后十个人用水管从你这里拿水。你这个龙头就是水的入口,水管就是你和这些人的依赖联系。现在供水局的要来查有多少个人在用你的水,只要顺这水管去查,就ok了。 webpack中的入口文件就是类似与这样的效
阅读全文
摘要:本文中使用的webpack版本是4+,请注意区分 node.js安装 node.js下载地址 选择较低版本的稳定版下载,下载完成后得到的是一个msi文件,点击安装即可 安装完毕以后新建一个文件夹,并在此文件夹下面按下shift+鼠标右键 在window10下这是在选中的目录下打开命令行窗口,也可以使
阅读全文
摘要:模块热替换(webpack文档上也叫 Hot Module Replacement 或 HMR)是 webpack 提供的最有用的功能之一。它允许在运行时更新各种模块,而无需进行完全刷新。 这句话其实很全面的webpack热加载的作用,但是如果没有实际操作过的话,你可能很难理解它在实际运用上的意义。
阅读全文
摘要:本文所用webpack版本为4+,阅读本章的同学请注意区分。 webpack默认不需要配置文件 但是你仍可在项目的node_module目录同级目录建立一个webpack.config.js文件进行配置 本人的苦逼经历觉得这句话还是挺重要的,所以开局先一句话, 本章主要介绍webpack 的devs
阅读全文