随笔分类 -  webpack

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