随着前端工程化的不断发展，构建工具也在不断完善。作为大前端时代的新宠，webpack渐渐成为新时代前端工程师不可或缺的构建工具，随着webpack4的不断迭代，我们享受着构建效率不断提升带来的快感，配置不断减少的舒适，也一直为重写的构建事件钩子机制煞费苦心，为插件各种不兼容心灰意冷，虽然过程痛苦，但结果总是美好的。经历了一番繁琐的配置后，我常常会想，这样一个精巧的工具，在构建过程中做了什么？我也是抱着这样的好奇，潜心去翻阅相关书籍和官方文档，终于对其中原理有所了解，那么现在，就让我们一起来逐步揭开webpack这个黑盒的神秘面纱，探寻其中的运行机制吧。
之前介绍过webpack3的新特性，里面提到webpack2支持了ES6的import和export，不需要将ES6的模块先转成CommonJS模块，然后再进行打包处理。正基于此，webpack2引入了tree-shaking技术，能够在模块的层面上做到打包后的代码只包含被引用并被执行的模块，而不被引用或不被执行的模块被删除掉，以起到减包的效果。 webpack的tree-shaking案例 下面结合实际代码来解释webpack2是如何实现tree-shaking的，示例代码可到github进行下载。 示例
今天运行是visual studio code时，报了一个错误Cannot find module 'webpack' ，网上找了很多方法都没解决。下面一起来看看怎么解决
在上篇博文中我们已经成功安装了truffle及所需相关环境，此篇就简单介绍一些truffle的使用及目录结构等。
平时写的文档一般用Gitbook管理，类似于Git，其实Git主要用于管理代码，而Gitbook则使用Git管理文档。写好的文档可以按照特定的目录编译，运行，部署，然后一个带有文档的网站就展现出来了。而Gitbook也提供了本地的运行环境，通过npm安装gitbook即可，直接通过gitbook 本地部署环境。
Homebrew 1.0.6(Mac)、Node.js 6.7.0、npm 3.10.3、webpack 1.13.2、vue-cli 2.4.0、Atom 1.10.2
关于 node 环境升级到 v8^ 以上，node-sass 报错的解决方法 今天给同事电脑升级了一下系统，顺便升级了所有的软件，发现原来好好的项目报错了。报错大致信息如下： ERROR Fail
Github链接：https://github.com/Jackson0714/BirdDoc 记得点个Star
为了省事，我直接在github上clone了一个小型webpack项目， 这是地址：https://github.com/acexyf/WebpackTest
关于如何在mac下搭建React环境这里就不详细介绍了，有兴趣的朋友可以看：在Mac上搭建RN基础环境，今天要说的是如何在mac下使用Atom＋Nuclide组合环境来开发项目。 安装Atom 如果没
安装环境 本文默认以MacOS为系统，毕竟除了用React Native搞Android,你也会想用它搞iOS。 首先当然是Android的环境搭建，这里还是推荐把整个Android开发环境都弄起来，顺便还可以学学Android。关于Android环境搭建，以及使用Android Studio可以参考我的另一篇文章搭建安卓开发环境(Android Studio) 这里就不赘述了,需要注意的是，要安装好SDK,AVD(不是AV,是Android Virtual Device)。 弄好Android开发环境
错误提示：npm resource busy or locked..... 可以先清除再重新安装：
6月20号webpack推出了3.0版本，官方也发布了公告。根据公告介绍，webpack团队将未来版本的改动聚焦在社区提出的功能需求，同时将保持一个快速、稳定的发布节奏。本文主要依据公告内容，简单介绍一下webpack3的新特性，以及在实际项目中的应用。 升级到webpack3 升级到webpack3，只需要通过npm安装即可： npm install webpack@3.0.0 --save-dev webpack3几乎与webpack2完美兼容，除了会影响一些插件的使用，官方给出的数据是：98%的用户升
3.安装puppeteer-core（直接安装pupperter会因为chromium无法下载而报错）
现在回过头来想想，也许选择以《JavaScript权威指南》一书来作为入门有些不好，因为这本书毕竟是很早之前的，书中所讲的思想、标准也基本都只是 ES5 及那时代的相关技术。
let session = require('express-session'); ^^^ SyntaxError: Block-scoped declarations (let, const, function, class) not yet supported outside strict mode at exports.runInThisContext (vm.js:53:16) at Module._compile (module.js:373:25) at Object.
A 引入 a.js，B 引入 b.js，这些代码最后都是存在于全局作用域里，难保不会出现变量命名冲突的问题。
快来免费体验ChatGpt plus版本的，我们出的钱 体验地址:https://chat.waixingyun.cn可以加入网站底部技术群，一起找bug，...
在输入命令npm start启动运行项目的时候，有时候会遇到这样的错误Error: Cannot find module 'mongoose'，缺少mongoose这个模块。
一、Linux内核概览 Linux是一个一体化内核（monolithic kernel）系统。 设备驱动程序可以完全访问硬件。 Linux内的设备驱动程序可以方便地以模块化（modularize）的形式设置，并在系统运行期间可直接装载或卸载。 1. linux内核 linux操作系统是一个用来和硬件打交道并为用户程序提供一个有限服务集的低级支撑软件。 一个计算机系统是一个硬件和软件的共生体，它们互相依赖，不可分割。 计算机的硬件，含有外围设备、处理器、内存、硬盘和其他的电子设备组成计算机的发动机。 但是没有软件来操作和控制它，自身是不能工作的。 完成这个控制工作的软件就称为操作系统，在Linux的术语中被称为“内核”，也可以称为“核心”。 Linux内核的主要模块（或组件）分以下几个部分： . 进程管理（process management） . 定时器（timer） . 中断管理（interrupt management） . 内存管理（memory management） . 模块管理（module management） . 虚拟文件系统接口（VFS layer） . 文件系统（file system） . 设备驱动程序（device driver） . 进程间通信（inter-process communication） . 网络管理（network management . 系统启动（system init）等操作系统功能的实现。 2. linux内核版本号 Linux内核使用三种不同的版本编号方式。 . 第一种方式用于1.0版本之前（包括1.0）。 第一个版本是0.01，紧接着是0.02、0.03、0.10、0.11、0.12、0.95、0.96、0.97、0.98、0.99和之后的1.0。 . 第二种方式用于1.0之后到2.6，数字由三部分“A.B.C”，A代表主版本号，B代表次主版本号，C代表较小的末版本号。 只有在内核发生很大变化时（历史上只发生过两次，1994年的1.0,1996年的2.0），A才变化。 可以通过数字B来判断Linux是否稳定，偶数的B代表稳定版，奇数的B代表开发版。C代表一些bug修复，安全更新，新特性和驱动的次数。 以版本2.4.0为例，2代表主版本号，4代表次版本号，0代表改动较小的末版本号。 在版本号中，序号的第二位为偶数的版本表明这是一个可以使用的稳定版本，如2.2.5; 而序号的第二位为奇数的版本一般有一些新的东西加入，是个不一定很稳定的测试版本，如2.3.1。 这样稳定版本来源于上一个测试版升级版本号，而一个稳定版本发展到完全成熟后就不再发展。 . 第三种方式从2004年2.6.0版本开始，使用一种“time-based”的方式。 3.0版本之前，是一种“A.B.C.D”的格式。 七年里，前两个数字A.B即“2.6”保持不变，C随着新版本的发布而增加,D代表一些bug修复，安全更新，添加新特性和驱动的次数。 3.0版本之后是“A.B.C”格式，B随着新版本的发布而增加,C代表一些bug修复，安全更新，新特性和驱动的次数。 第三种方式中不使用偶数代表稳定版，奇数代表开发版这样的命名方式。 举个例子：3.7.0代表的不是开发版，而是稳定版！ linux内核升级时间图谱如下:
ECMAScript模块是 JavaScript 的新标准格式。在Node.js中越来越多的库逐渐从从CommonJS转移到ES模块
安装步骤 安装 node.js (网址：https://nodejs.org/en/)。 基于 node.js ,利用淘宝 npm 镜像安装相关依赖。在 cmd 里直接输入：npm install -g cnpm –registry=https://registry.npm.taobao.org，回车，等待安装。 安装全局 vue-cli 脚手架,用于帮助搭建所需的模板框架，在 cmd 里 输入：cnpm install -g vue-cli，回车，等待安装； 输入： vue ，回车，若出现 vue
因为 chromedriver 被墙了，所以需要输入命令 cnpm install chromedriver ，安装 chromedriver 。
#---------- ADDED BY BOOTADM - DO NOT EDIT ---------- title Oracle Solaris 10 8/11 s10x_u10wos_17b X86 findroot (rootfs0,2,a) kernel /platform/i86pc/multiboot module /platform/i86pc/boot_archive #---------------------END BOOTADM-------------------- #---------- ADDED BY BOOTADM - DO NOT EDIT ---------- title Solaris failsafe findroot (rootfs0,2,a) kernel /boot/multiboot kernel/unix -s module /boot/x86.miniroot-safe #---------------------END BOOTADM--------------------
matchAll() 方法返回一个包含所有匹配正则表达式的结果的迭代器。可以使用 for...of 遍历，或者使用 展开运算符(...) 或者 Array.from 转换为数组.
Rollup 和 Webpack 是目前项目中使用较为广泛的两种打包工具，去年发布的 Vite 中打包所依赖的也是 Rollup；在对界面加载效率要求越来越高的今天，打包工具最终产出的包体积也影响着开发人员对工具的选择，所以对 Tree-shaking 的支持程度和配置的便捷性、有效性就尤为重要了。本文就来简单分析下两者 Tree-shaking 的流程和效果差异。
版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/z2066411585/article/details/89018507
从指定监听器数组中删除一个监听器。需要注意的是，此操作将会改变处于被删监听器之后的那些监听器的索引。
今天给新来的前端同事安装了 DeepinLinux，然后在运行 React 项目的时候出现了 Error: watch ENOSPC 的报错。我很奇怪为什么会出现这个错误，随后找到了这篇文章，原文如下：
作者： 神Q超人 译者：前端小智 来源：medium 前阵子在和朋友聊 Webpack 的时候，突然提到 Tree Shaking，但很惭愧的是我没有办法好好说明 Webpack 是如何做到 Tree Shaking 的，因此就趁这个年假的第一天抽空读 Webpack 的文件，然后把理解到的心得写下来，如果你也有兴趣，就一起看下去吧 🙌。 Tree Shaking 是什麽 Tree Shaking 是个优化的方式，在 JavaScript 中用来表示移除没用的代码的一个常见术语，之所以叫做 Tree Sha
最近和部门老大，一起在研究团队【EFT - 前端新手村】的建设，目的在于：帮助新人快速了解和融入公司团队，帮助零基础新人学习和入门前端开发并且达到公司业务开发水平。
1.修改控制台输出内容样式 2.重写控制台输出格式(追加出错日期) 3.以表格的形式显示控制台输出内容 4.如何统计一个函数在程序中被调用的总次数 5.以便于阅读的形式输出打印内容 6.统计程序执行的时间 7.分组显示控制台输出内容 8.获取当前代码在堆栈中的调用路径 9.清除控制台显示的所有内容 10.断言输出
本指南为开发者提供了使用 Taro 框架开发鸿蒙原生应用的快速入门方法。Taro，作为一个多端统一开发框架，让开发者能够使用一套代码同时适配多个平台，包括鸿蒙系统。文章将详细介绍如何配置开发环境，以及如何利用 Taro 的特性和组件库来构建鸿蒙应用。从基本的项目设置到复杂的应用逻辑开发，本文将一步步引导开发者了解 Taro 在鸿蒙应用开发中的实际应用，快速掌握跨平台开发的技巧。
服务是什么？先来看一下服务的定义：一台主机上提供的、运行的各种功能统称为服务。有本机内服务，如：at，cron，有对外的网络服务，如：web、ftp等，又称为业务、应用。下面我们来分析一下Linux中服务的具体管理。
Node.js的API主要有两种风格，同步和异步，如何区分呢，大部分异步API一般都有一个回调函数 callback 作为其参数，而大部分同步API则不会，例如：
整理学习react技术栈相关知识，在写了一个电商AppDemo后，开始思考起该如何高效的组织react项目的项目结构。
Open Harmony 是由开放原子开源基金会孵化及运营的开源项目，由开放原子开源基金会 Open Harmony 项目群工作委员会负责运作。由全球开发者共建的开源分布式操作系统，具备面向全场景、分布式等特点，是一款“全（全领域）・ 新 （新一代）・ 开（开源）・ 放（开放）”的操作系统。
本文记录了本人以及目前团队从无到有使用React的过程，我们将从webpack开始说起，一步一步展现React最基本的开发生态。在这里并不会介绍任何jsx或es6相关的语法，只聚焦于如何使用react生态搭建利于团队协作、有利于提升开发效率的开发环境。
Ruby on Rails是一个流行的Web应用程序框架，旨在帮助您开发成功的项目，同时编写更少的代码。为了使Web开发变得有趣并且受到强大社区的支持，Ruby on Rails是一个可以免费使用的开源软件，并且欢迎各位用户提出建议以使其更好。
现在，按下电源键 下面是Android启动的核心步骤流程图，看文字的时候，记得回来对照图来理解喔，希望阅读全文后，回观流程图，会有恍然大悟的感觉，那么文章的目的就达到啦 : 一、启动电源及系统启动 系统从 ROM 中开始启动，加载引导程序到 RAM ，然后执行。 二、引导程序 引导程序是 Android 操作系统开始运行前的一个小程序，因此它需要针对特定主板与芯片，并不是 Android 操作系统的一部分。引导程序是OEM厂商或运行商进行加锁、限制的地方。 1、两个阶段 检测外部 RAM
一、简介 1、什么是webpack webpack是近期最火的一款模块加载器兼打包工具，它能把各种资源，例如JS（含JSX）、coffee、样式（含less/sass）、图片等都作为模块来使用和处理。 我们可以直接使用 require(XXX) 的形式来引入各模块，即使它们可能需要经过编译（比如JSX和sass），但我们无须在上面花费太多心思，因为 webpack 有着各种健全的加载器（loader）在默默处理这些事情，这块我们后续会提到。 你可以不打算将其用在你的项目上，但没有理由不去掌握它，因为以近期
任何系统启动的第一步都是加电，也就是按下电源，然后计算机硬件会主动读取BIOS来加载硬件设备信息以及硬件设备的自我检测，之后系统会主动地读取第一个有引导程序的设备，该引导程序可以指定使用哪个内核来启动，并将其加载至内存当中运行，同时内核还要加载其他硬件设备以及对应的驱动程序，来使主机各个组件开始运行，等所有硬件设备加载完成之后，系统就真正启动来了，然后系统会操作一些外部程序开始准备软件的运行环境。之后加载一些系统运行所需要的软件程序。最后一步就是等待用户的登陆。
正如当年为了统一 JavaScript 语言标准，人们制定了 ECMAScript 规范一样，如今为了统一 JavaScript 在浏览器之外的实现，CommonJS 诞生了。CommonJS 试图定义一套普通应用程序使用的 API，从而填补 JavaScript 标准库过于简单的不足。CommonJS 的终极目标是制定一个像 C++ 标准库一样的规范，使得基于 CommonJS API 的应用程序可以在不同的环境下运行，就像用 C++ 编写的应用程序可以使用不同的编译器和运行时函数库一样。为了保持中立，CommonJS 不参与标准库实现，其实现交给像 Node.js 之类的项目来完成。
这是因为nodejs版本太低，或者说webpack版本太高，我这里用的nodejs版本是4.4.7，默认安装的webpack版本是4.3.0，所以不兼容。然后我把webpack卸载掉，重新安装了2.6.1版本的webpack，问题解决：
最近在看Vue源码的时候发现一个新的打包工具Rollup.js，之前没有听说过这个工具，也不了解Rollup.js相比于常用的打包工具webpack有什么异同和优势，随后查了一下了解到Vue，React，D3，Three.js，Moment源码里都有它的身影，Rollup到底什么？这篇文章带你走进Rollup的世界。
大家好，今天我来和大家一起来了解前端模块化工具webpack的知识，如有疑问和错误，欢迎指正，一起交流探讨哈！
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频
