Webpack 正在参加 2021 年度 OSC 中国开源项目评选,请投票支持!
Webpack 在 2021 年度 OSC 中国开源项目评选 中已获得 {{ projectVoteCount }} 票,请投票支持!
2021 年度 OSC 中国开源项目评选 正在火热进行中,快来投票支持你喜欢的开源项目!
2021 年度 OSC 中国开源项目评选 >>> 中场回顾
Webpack 获得 2021 年度 OSC 中国开源项目评选「最佳人气项目」 !
授权协议 MIT
操作系统 跨平台
软件类型 开源软件
开源组织 Linux 基金会
地区 不详
投 递 者 红薯
适用人群 未知
收录时间 2014-07-27

软件简介

Webpack 是一个模块打包器,主要目的是在浏览器上打包 JavaScript 文件。

TL;DR

  • 捆绑 ES 模块CommonJS 和 AMD 模块(以及绑定)。
  • 可以创建在运行时异步加载的单个捆绑包或多个块(以减少初始加载时间)。
  • 在编译过程中解决了依赖性,从而减小了运行时大小。
  • 加载程序可以在编译时对文件进行预处理,例如,将 TypeScript 转换为 JavaScript、将Handlebars字符串转换为已编译函数、将图像转换为 Base64,等等。
  • 高度模块化的插件系统可以执行您的应用程序所需的其他任何操作。

原理

示例代码

// webpack is a module bundler
// This means webpack takes modules with dependencies
//   and emits static assets representing those modules.

// dependencies can be written in CommonJs
var commonjs = require("./commonjs");
// or in AMD
define(["amd-module", "../file"], function(amdModule, file) {
    // while previous constructs are sync
    // this is async
    require(["big-module/big/file"], function(big) {
         // for async dependencies webpack splits
         //  your application into multiple "chunks".
         // This part of your application is
         //  loaded on demand (Code Splitting)
        var stuff = require("../my/stuff");
        // "../my/stuff" is also loaded on demand
        //  because it's in the callback function
        //  of the AMD require
    });
});


require("coffee!./cup.coffee");
// "Loaders" can be used to preprocess files.
// They can be prefixed in the require call
//  or configured in the configuration.
require("./cup");
// This does the same when you add ".coffee" to the extensions
//  and configure the "coffee" loader for /\.coffee$/


function loadTemplate(name) {
    return require("./templates/" + name + ".jade");
    // many expressions are supported in require calls
    // a clever parser extracts information and concludes
    //  that everything in "./templates" that matches
    //  /\.jade$/ should be included in the bundle, as it
    //  can be required.
}


// ... and you can combine everything
function loadTemplateAsync(name, callback) {
    require(["bundle?lazy!./templates/" + name + ".jade"], 
      function(templateBundle) {
        templateBundle(callback);
    });
}
展开阅读全文

代码

的 Gitee 指数为
超过 的项目

评论

点击加入讨论🔥(7)
发表了资讯
11/10 07:33

Webpack v5.75.0 已发布

Webpack 是一个模块打包器,主要目的是在浏览器上打包 JavaScript 文件。Webpack v5.75.0 现已发布,具体更新内容如下: Bug 修复 避免NaN% 在代码中使用冲突的 chunk name 时显示 correct error HMR 代码在尝试访问window之前测试其存在性 修复eval-nosources-*实际排除来源 修复没有从处理模块返回模块的 race condition 修复运行时代码中 standalong semicolon 的位置问题 Features 在节点中使用实验性 CSS 时添加对外部 CS...

2
0
发表了资讯
07/26 07:03

Webpack v5.74.0 已发布

Webpack 是一个模块打包器,主要目的是在浏览器上打包 JavaScript 文件。Webpack v5.74.0 现已发布,具体更新内容如下: Features 添加resolve.extensionAlias选项,允许别名扩展名 当你被迫为导入文件添加 .js 扩展名时,这很有用,因为文件真正的扩展名是 .ts(typecript + "type": "module")。 添加对 ES2022 features 的支持,例如静态块 为ProvidePlugin添加 Tree Shaking 支持 Bug 修复 当某些构建依赖项位于不同的 Wind...

0
1
发表了资讯
05/12 07:04

Webpack v5.72.1 已发布

Webpack 是一个模块打包器,主要目的是在浏览器上打包 JavaScript 文件。 目前 Webpack 5.72.1 已发布,带来少量修复: 使用 HMR 修复 __webpack_nonce__ 在某些情况下修复 in 运算符 修复 json 解析错误信息 使用 this.importModule 修复模块连接 升级 enhanced-resolve 更新公告:https://github.com/webpack/webpack/releases/tag/v5.72.1...

2
0
发表了资讯
04/02 07:30

Webpack v5.71.0 已发布

Webpack v5.71.0 已发布,带来如下改动: 特性 使用包含占位符的 output.library 时,为 uniqueName 选择更智能的默认值 支持带有 in 导入绑定的表达式 尽可能使用箭头函数生成 UMD 代码 Bug 修复 将 ContextModule 的源映射源名称修复为 relative 修复模块模块中的 chunkLoading 选项 修复 evaluateExpression 返回 null 的边缘情况 在导入的绑定中保留可选链 即使不使用块加载,也包括基本 URI 的运行时代码 通过 ESM 导入 no...

0
1
发表了资讯
03/05 07:56

Webpack v 5.70.0 已发布

Webpack v 5.70.0 发布了!Webpack 是一个常见的静态模块打包工具,主要用途是在浏览器上打包 JavaScript 文件。 版本主要改动如下: 新特性 更新 ESM 支持的 node.js 版本约束 添加baseUri到entry选项,以配置静态基础 uri(基于 new URL()) 尽可能按字母顺序对命名空间对象中的导出进行排序 添加 __webpack_exports_info__.name.canMangle 添加代理支持到 experiments.buildHttp import.meta.webpackContext 作为 ESM 的替代...

1
0
发表了资讯
02/18 07:05

Webpack 5.69.0 发布,模块打包器

webpack 5.69.0 现已发布。webpack 是一个模块打包器,主要目的是在浏览器上打包 JavaScript 文件。 具体更新内容如下: Features 启用 ESM 输出模式时自动切换到 ESM 兼容环境 在创建上下文模块时处理多个替代目录(e. g. due to resolve.alias or resolve.modules) 添加util/types到 node.js 内置模块 添加__webpack_exports_info__.<name>.canMangleapi Bug 修复 修复 chunk graph generation 中的错误,该错误导致模块被包...

0
1
发表了资讯
01/26 07:07

Webpack 5.67.0 发布,模块打包器

webpack 5.67.0 现已发布。webpack 是一个模块打包器,主要目的是在浏览器上打包 JavaScript 文件。 具体更新内容如下: Features 为资源资产模块添加“outputPath”配置选项 在 eval source maps 中支持 Trusted Types experiments.css 允许只为节点中的 css 生成导出 添加SyncModuleIdsPlugin,在服务器和客户端编译中同步模块 ID 为DeterministicModuleIdsPlugin添加更多选项,以允许生成相同的 id Developer Experience 在统...

0
1
2021/11/27 07:11

Webpack 5.64.4 发布,模块打包器

webpack 5.64.4 现已发布。webpack 是一个模块打包器,主要目的是在浏览器上打包 JavaScript 文件。 具体更新内容如下: Bug 修复 修复了标记的模板文字评估 修复带有 ESM 的 ModuleFederation 修复带有 intial splitChunks 的 outputModule Performance 升级 watchpack 以加快 watcher 的更新 在 watchpack 和 webpack 中分别跟踪文件和目录时间戳 Developer Experience 在 mismatch warning 中显示单例共享模块的来源 更新说明...

0
0
发表了资讯
2021/11/16 07:19

webpack 5.64.1 发布 ,静态模块打包工具

Webpack v 5.64.1 发布了!Webpack 是一个常见的静态模块打包工具,主要用途是在浏览器上打包 JavaScript 文件。 版本主要改动如下: 修复 managedPaths 中的正则表达式,以排除额外的斜杠。 使 module.accept errorHandler 在类型中可选。 在 require.ensure 中使用 require(...).property 时正确创建异步块。 修复了 output.clean: true 中符号链接的清理问题。 在 managedPaths (node 模块) 中使用 unsafeCache 修复更改检测...

1
1
发表了资讯
2021/11/07 07:36

webpack 5.62.0 发布 ,静态模块打包工具

Webpack v 5.62.0 发布了!Webpack 是一个常见的静态模块打包工具,主要用途是在浏览器上打包 JavaScript 文件。 新特性 加入 parser.javascript.reexportExportsPresence: false ,用于 TypeScript 类型再导出。允许在 export ... from "..." 到 export type ... from "..." 迁移期间对不存在的导出禁用警告。 添加experiments.backCompat: false,用于禁用一些高性能消耗的功能,以获得更好的性能。 Bug 修复 用 ['catch'] 代...

1
1
发表了资讯
2021/10/21 07:16

Webpack 发布 5.59.0 版本,静态模块打包工具

Webpack v5.59.0 发布了!Webpack 是一个常见的静态模块打包工具,主要用途是在浏览器上打包 JavaScript 文件。 此版本主要更新内容如下: 新特性 生成代码的时候为 Object()加入/*#__PURE__*/ 注释 为 managed/immutablePath 加入正则表达式和函数支持。 在构建组件的多个阶段加入 Hooks 。 优化 experiments.buildHttp: 允许共享缓存 添加许可名单 加入 splitChunks.minSizeReduction 选项。 bug 修复 修复了 Data URLs 的内...

2
1
发表了资讯
2021/10/08 07:25

webpack 5.58.0 发布,模块打包器

webpack 5.58.0 现已发布。webpack 是一个模块打包器,主要目的是在浏览器上打包 JavaScript 文件。 具体更新内容如下: Features 为 readResource 添加 hook 添加diagnostics_channel到 node builtins Performance 提高 chunk graph creation 性能 添加 cacheUnaffected 缓存支持 删除一些没有区别的缓存 提高 splitChunks 的性能 提高 chunk conditions 性能 更新说明:https://github.com/webpack/webpack/releases/tag/v5....

0
0
2021/09/26 07:31

webpack 5.54.0 发布,模块打包器

webpack 5.54.0 现已发布。webpack 是一个模块打包器,主要目的是在浏览器上打包 JavaScript 文件。 具体更新内容如下: Features 改进常量折叠以允许跳过更多 && || 和 ?? 分支 允许在 webpack 中使用所有的 hashing,用output.hashFunction进行配置 在模块中使用eval时,不再完全从内部图分析中跳出 Bug 修复 force bump enhanced - 解决错误的方法 Performance 减少创建 snapshots 时的分配次数 添加output.hashFunction: "x...

0
1
2021/08/12 07:50

webpack 5.50.0 发布,模块打包器

webpack 5.50.0 现已发布。webpack 是一个模块打包器,主要目的是在浏览器上打包 JavaScript 文件。 具体更新内容如下: Features hashbangs ( #! ...) 现在由 webpack 处理 https://github.com/tc39/proposal-hashbang Performance 默认情况下禁用缓存压缩,因为它会使性能变差 仍然可以针对特定场景再次启用 减少缓存序列化期间的分配次数 这提高了性能和内存使用率 更新说明:https://github.com/webpack/webpack/releases/t...

2
3
发表于大前端专区
2021/01/13 08:56

webpack 5.13.0 发布,模块打包器

webpack 5.13.0 发布了。webpack 是一个模块打包器,主要目的是在浏览器上打包 JavaScript 文件。 更新内容包括: 添加resolve.preferAbsoluteflag 以与 webpack 4 兼容 在exports和imports字段中添加对通配符的支持 优化 chunk 和 module 名字 为 module 名字添加nameForCondition()备用方案 确定 chunk root 模块时,正确处理仅传递副作用的模块连接 更新详情:https://github.com/webpack/webpack/releases/tag/v5.13.0...

3
1
发表于大前端专区
2020/10/13 11:51

Webpack 5 发布,主要做架构改进

时隔两年,Webpack 5 正式发布。 Webpack 是一个模块打包器,主要目的是在浏览器上打包 JavaScript 文件。Webpack 4于2018年2月发布,其官方发布通告称,人们不喜欢带有突破性的重大变化,尤其是Webpack,人们通常一年只接触两次 ,剩下的时间就 "只管用 "了。这是两个大版本之间相隔两年多的原因之一。 这次 Webpack 5更新,主要包含架构上的改进,以及没有这些改进就不可能实现的功能。 整体方向 这个版本的重点在于以下几点。...

8
13
发表于服务端专区
2020/07/27 07:25

webpack 4.44.0 发布,模块打包器

webpack 4.44.0 发布了。webpack 是一个模块打包器,主要目的是在浏览器上打包 JavaScript 文件。 特性方面的更新包括: 当动态模块成为树的一部分时,改善 sideEffects 标志行为 添加splitChunks.enforceSizeThreshold以允许拆分与其他限制无关的较大块 添加对resolve.roots的支持,并默认resolve.roots: [context] 此外还有一些 bug 修复,详情查看更新说明: https://github.com/webpack/webpack/releases/tag/v4.44.0...

3
2
发表于大前端专区
2019/12/23 07:16

webpack 5.0.0 beta 10 发布,模块打包器

webpack 5.0.0 beta 10 发布了。webpack 是一个模块打包器,主要目的是在浏览器上打包 JavaScript 文件。 此版本带来的新特性包括: 关联的模块现在可以持久缓存 向基于 eval 的 devtools 添加有关输出文件可读性的解释性注释 改进了进度分析模式,以显示每个插件和子步骤的计时 性能上为模块工厂的封装器代码添加内存缓存,此外还有一些 bug 修复,详情查看更新说明: https://github.com/webpack/webpack/releases/tag/v5.0.0...

2
3
发表于开发技能专区
2019/11/26 07:00

webpack 5.0.0-beta.7 发布,模块打包器

webpack 5.0.0-beta.7 发布了。webpack 是一个模块打包器,主要目的是在浏览器上打包 JavaScript 文件。 此版本带来的新特性包括: 将弃用代码添加到所有弃用中 在 watchRun 中添加带有一组所有已修改文件的 Compiler.modifiedFiles 此外还有一些 bug 修复与重构等内容,详情查看: https://github.com/webpack/webpack/releases/tag/v5.0.0-beta.7...

0
0
发表于开发技能专区
2019/08/04 07:23

webpack 4.39.0 发布,JS 模块打包器

webpack 4.39.0 和 4.39.1 发布了。webpack 是一个模块打包器,主要目的是打包 JavaScript 文件以便在浏览器中使用。 此版本更新如下: 性能 node.js 的基础结构记录器现在具有颜色+符号,以标记不同类型的消息 Logger API 现在具有一种 status 方法,允许编写临时状态消息 ProgressPlugin 默认处理程序使用 Infrastructure Logger 状态消息输出消息 路径中的占位符现在可以使用 i 进行转义,即 [\id\] 添加 Compiler.hooks.ass...

0
2
没有更多内容
加载失败,请刷新页面
点击加载更多
加载中
下一页
发表了博客
{{o.pubDate | formatDate}}

{{formatAllHtml(o.title)}}

{{parseInt(o.replyCount) | bigNumberTransform}}
{{parseInt(o.viewCount) | bigNumberTransform}}
没有更多内容
暂无内容
发表了问答
{{o.pubDate | formatDate}}

{{formatAllHtml(o.title)}}

{{parseInt(o.replyCount) | bigNumberTransform}}
{{parseInt(o.viewCount) | bigNumberTransform}}
没有更多内容
暂无内容
nanoid安全漏洞
不正确的类型转换
nanoid是用于 JavaScript 的小型、安全、URL 友好、唯一的字符串 ID 生成器。 nanoid安全中存在漏洞,该漏洞源于nanoid 容易通过 valueOf() 函数受到信息暴露的影响,该函数允许重现最后生成的 id。
CVE-2021-23566 MPS-2021-19605
2022-08-08 18:33
Async 安全漏洞
原型污染
Async是英国Caolan McMahon个人开发者的一个实用模块。用于使用异步 JavaScript。 Async 3.2.1 及之前版本存在安全漏洞,该漏洞源于 mapValues() 方法。攻击者可通过 mapValues() 方法获取权限。
CVE-2021-43138 MPS-2021-34434
2022-08-08 18:33
uglify-js 存在ReDoS漏洞
ReDoS
uglify-js 是一个 JavaScript 解析器、压缩器、压缩器和美化工具包。此软件包的受影响版本容易通过 string_template 和 decode_template 函数受到正则表达式拒绝服务 (ReDoS) 的攻击。
MPS-2022-14112
2022-08-08 18:33
simple-git-hooks存在未明漏洞
命令注入
simple-git-hooks是一个应用软件。一个简单的git钩子经理小型项目。simple-git-hooks 3.5.0之前版本存在安全漏洞,攻击者利用该漏洞进行命令注入。
CVE-2022-24066 MPS-2022-5073
2022-08-08 18:33
needle 存在Authorization请求头泄露漏洞
信息暴露
needle 是 一款流式传输的HTTP客户端 needle 没有对重定向后的请求头做过滤处理,会把第一次请求的 Authorization 请求头也传递到重定向后的服务,导致 Authorization 请求头泄露。 攻击者可利用该漏洞被动窃取用户的 Authorization 数据。
MPS-2022-7866
2022-08-08 18:33
没有更多内容
加载失败,请刷新页面
点击加载更多
加载中
下一页
7 评论
113 收藏
分享
OSCHINA
登录后可查看更多优质内容
返回顶部
顶部