webpack项目如何正确打包引入的自定义字体
一. 如何在Vue或React项目中使用自定义字体在开发前端项目时，经常会遇到UI同事希望在项目中使用一个炫酷字体的需求。那么怎么在项目中使用自定义字体呢？其实实现起来并不复杂，可以借用CSS3 @font-face 来实现。本文着重介绍一下 webpack 项目如何正确打包引入的自定义字体。可以访...
vue项目初始化时npm run dev报错webpack-dev-server解决方法
vue项目初始化时npm run dev报错webpack-dev-server解决方法原因：这是新版webpack存在的BUG，卸载现有的新版本webpack，装老版本就好webpack-dev-server 版本需要从最新版本降低到如下版本,因为开始构建项...
vite 和 webpack 的区别
Vite 和 Webpack 是两种不同的前端构建工具，它们在设计理念、构建原理和使用方式上有一些显著的区别： 构建原理： Vite：Vite 基于现代浏览器原生 ES 模块的导入机制，利用 ES 模块的特性，将每个模块作为一个个独立的请求处理，不需要像...
【前端工程化面试题】如何优化提高 webpack 的构建速度
使用最新版本的 Webpack 和相关插件: 每个新版本的 Webpack 都会带来性能方面的改进和优化，因此始终确保你在使用最新版本。同时，更新你的相关插件也是同样重要的。 合理配置 Webpack: 优化 Webpack 的配置文件，包括合理设置 entry、output、resolve、l...
如何使用webpack打包html+css+js+img+font?
如何使用webpack打包html+css+js+img+font? 工作中需要打包单个小项目带着疑问去试试。1.创建一个空文件夹，如下图 评论(0) 编辑 收藏 0x00.项目初始化由于整个过程像素级 copy element，所以将不使用vue-cli初始化项目...
浅谈Webpack模块打包工具一
浅谈Webpack模块打包工具一 为什么要使用模块打包工具1.模块化开发ES Modules存在兼容性问题 打包之后成产阶段编译为ES5 解决兼容性问题2.模块文件过多 网络请求频繁 开发阶段把散...
骨架屏(page-skeleton-webpack-plugin)初探
最近频频看到了`骨架屏`这个词，其实在这之前鲜少听过`骨架屏`这个词。只是平时在浏览网站时，会经常看到某个页面在尚未获取到真正数据时展示的一...
webpack正式、测试环境接口地址本地运行及打包命令配置
声明：本文由w3h5原创，转载请注明出处：《webpack正式、测试环境接口地址本地运行及打包命令配置》 https://www.w3h5.com/post...
假如用王者荣耀的方式学习webpack
英雄介绍崴博.派克诞生于遥远西方的勇士之地，拥有着高超的机械技艺，善于运用各种工具来实现一些看似不可能完成的事。游历王者大陆时机缘巧合遇到了年轻的墨子，与之...
Webpack配置区分开发环境和生产环境
在项目开发的时候，我们通常会将程序分为开发环境和生产环境（或者叫线上环境），开发环境通常指的是我们正在开发的这个阶段所需要的一些环境配置，也就是方便我们开发人员调试...
重学webpack
1 优化 webpack 打包体积的思路 优化 webpack 打包体积的思路包括： 提取第三方库或通过引用外部文件的方式引入第三方库：将第三方库单独打包，并通过 CDN 引入，减少打包体积。使用代码压缩插件：例如 UglifyJsPlugin，可以压缩 JavaScript 代码，减小文件体积。启...
什么是WebPack，为什么要使用它？
官方参考下载资源：https://www.yinxiangit.comwebpack中文网站 https://doc.webpack-china.org/w...
Webpack5入门到原理3：基本配置
在开始使用 Webpack 之前，我们需要对 Webpack 的配置有一定的认识。 5 大核心概念 entry（入口）指示 Webpack 从哪个文件开始打包 output（输出）指示 Webpack 打包完的文件输出到哪里去，如何命名等 loader（加载器）webpack 本身只能处理 js、j...
webpack生成的css文件background-image url图片无法加载
之前在使用webpack3构建基于less预处理的项目时，在对指定的元素使用background-image: url(xxx)来设置背景图片时，本地开发是ok的，...
webpack4+koa2+vue 实现服务器端渲染(详解)
webpack4+koa2+vue 实现服务器端渲染(详解) 2019-06-18 23:04 by 龙恩0707, ... 阅读, ... 评论, 收藏, 编辑 阅读目录一：什么是服务器端渲染？什么是客户端渲染？他们的优缺点？二：了解 vue-serv...
webpack之前端性能优化（史上最全，不断更新中。。。）
最近在用webpack优化首屏加载性能，通过几种插件之后我们上线前后的速度快了一倍，在此就简单的分享下吧，先上个优化前后首屏渲染的对比图。可以看到总下载时间从3800ms缩短到1600ms。我们在用webpack时一般都会选择多入口文件吧，为的就是将自己的源码跟第三方库代码分离。这是之前的代码，en...
webpack的四大核心概念
webpack中文文档:https://doc.webpack-china.org/concepts/一、Entry（入口）1、单个入口（简写）语法// 语法entry: string|Array<string>// 用法module.exports = { entry: './ind...