Webpack

Last updated
Webpack
Developer(s) Tobias Koppers, Sean Larkin, Johannes Ewald, Juho Vepsäläinen, Kees Kluskens, Even Stensberg and Webpack contributors
Initial release19 February 2014;10 years ago (2014-02-19) [1]
Stable release
5.93.0 [2]   OOjs UI icon edit-ltr-progressive.svg / 11 July 2024;26 days ago (11 July 2024)
Repository github.com/webpack/webpack
Written in JavaScript
Operating system Linux, macOS, Windows
Platform Node.js
License MIT License [3] [4]
Website webpack.js.org OOjs UI icon edit-ltr-progressive.svg

Webpack is a free and open-source module bundler for JavaScript. [5] [6] [7] [8] It is made primarily for JavaScript, but it can transform front-end assets such as HTML, CSS, and images if the corresponding loaders are included. [9] Webpack takes modules with dependencies and generates static assets representing those modules. [10]

Contents

Webpack takes the dependencies and generates a dependency graph allowing web developers to use a modular approach for their web application development purposes. It can be used from the command line or can be configured using a configuration file which is named webpack.config.js. This file defines rules, plugins, etc., for a project. (Webpack is highly extensible via rules which allow developers to write custom tasks that they want to perform when bundling files together.)

Node.js is required to use Webpack.

Webpack provides code on demand using the moniker code splitting. Two similar techniques are supported by Webpack when it comes to dynamic code splitting. The first and recommended approach is to use the import() syntax that conforms to the ECMAScript proposal for dynamic imports. The legacy, Webpack-specific approach is to use require.ensure. [11]

Webpack development server

Webpack also provides a built-in development server, webpack-dev-server, that can be used as an HTTP server for serving files while developing. It also provides the capability to use hot module replacement (HMR), which updates code on a webpage without requiring the developer to reload the page.

See also

Related Research Articles

Server-side scripting is a technique used in web development which involves employing scripts on a web server which produces a response customized for each user's (client's) request to the website. Scripts can be written in any of a number of server-side scripting languages that are available. Server-side scripting is distinguished from client-side scripting where embedded scripts, such as JavaScript, are run client-side in a web browser, but both techniques are often used together. The alternative to either or both types of scripting is for the web server itself to deliver a static web page.

<span class="mw-page-title-main">Ruby on Rails</span> Server-side open source web application framework

Ruby on Rails is a server-side web application framework written in Ruby under the MIT License. Rails is a model–view–controller (MVC) framework, providing default structures for a database, a web service, and web pages. It encourages and facilitates the use of web standards such as JSON or XML for data transfer and HTML, CSS and JavaScript for user interfacing. In addition to MVC, Rails emphasizes the use of other well-known software engineering patterns and paradigms, including convention over configuration (CoC), don't repeat yourself (DRY), and the active record pattern.

<span class="mw-page-title-main">Dojo Toolkit</span> Open-source modular JavaScript library

Dojo Toolkit is an open-source modular JavaScript library designed to ease the rapid development of cross-platform, JavaScript/Ajax-based applications and web sites. It was started by Alex Russell, Dylan Schiemann, David Schontzler, and others in 2004 and is dual-licensed under the modified BSD license or the Academic Free License.

A static web page, sometimes called a flat page or a stationary page, is a web page that is delivered to a web browser exactly as stored, in contrast to dynamic web pages which are generated by a web application.

TypeScript is a free and open-source high-level programming language developed by Microsoft that adds static typing with optional type annotations to JavaScript. It is designed for the development of large applications and transpiles to JavaScript. Because TypeScript is a superset of JavaScript, all JavaScript programs are syntactically valid TypeScript, but they can fail to type-check for safety reasons.

A single-page application (SPA) is a web application or website that interacts with the user by dynamically rewriting the current web page with new data from the web server, instead of the default method of a web browser loading entire new pages. The goal is faster transitions that make the website feel more like a native app.

<span class="mw-page-title-main">Node.js</span> JavaScript runtime environment

Node.js is a cross-platform, open-source JavaScript runtime environment that can run on Windows, Linux, Unix, macOS, and more. Node.js runs on the V8 JavaScript engine, and executes JavaScript code outside a web browser.

CommonJS is a project to standardize the module ecosystem for JavaScript outside of web browsers.

npm JavaScript package manager

npm is a package manager for the JavaScript programming language maintained by npm, Inc., a subsidiary of GitHub. npm is the default package manager for the JavaScript runtime environment Node.js and is included as a recommended feature in the Node.js installer.

<span class="mw-page-title-main">Amber Smalltalk</span>

Amber Smalltalk, formerly named Jtalk, is an implementation of the programming language Smalltalk-80, that runs on the JavaScript runtime of a web browser. It is designed to enable client-side development using Smalltalk. The programming environment in Amber is named Helios.

Mojito is an environment agnostic, Model-View-Controller (MVC) web application framework. It was designed by Ric Allinson.

Yeoman is an open source client-side scaffolding tool for web applications. Yeoman runs as a command-line interface written for Node.js and combines several functions into one place, such as generating a starter template, managing dependencies, running unit tests, providing a local development server, and optimizing production code for deployment.

<span class="mw-page-title-main">Asynchronous module definition</span>

Asynchronous module definition (AMD) is a specification for the programming language JavaScript. It defines an application programming interface (API) that defines code modules and their dependencies, and loads them asynchronously if desired. Implementations of AMD provide the following benefits:

Grunt is a JavaScript task runner, a tool used to automatically perform frequent tasks such as minification, compilation, unit testing, and linting. It uses a command-line interface to run custom tasks defined in a file. Grunt was created by Ben Alman and is written in Node.js. It is distributed via npm. As of October 2022, there were more than 6,000 plugins available in the Grunt ecosystem.

<span class="mw-page-title-main">Babel (transcompiler)</span> Backwards compatible JavaScript compiler

Babel is a free and open-source JavaScript transcompiler that is mainly used to convert ECMAScript 2015+ (ES6+) code into backwards-compatible JavaScript code that can be run by older JavaScript engines. It allows web developers to take advantage of the newest features of the language.

JS++ is a proprietary programming language for web development that extends JavaScript with a sound type system. It includes imperative, object-oriented, functional, and generic programming features.

Next.js is an open-source web development framework created by the private company Vercel providing React-based web applications with server-side rendering and static website generation.

<span class="mw-page-title-main">Deno (software)</span> Secure JavaScript and TypeScript runtime

Deno is a runtime for JavaScript, TypeScript, and WebAssembly that is based on the V8 JavaScript engine and the Rust programming language. Deno was co-created by Ryan Dahl, who also created Node.js.

<span class="mw-page-title-main">AssemblyScript</span> Programming language, variant of TypeScript that compiles to WebAssembly

AssemblyScript is a TypeScript-based programming language that is optimized for, and statically compiled to, WebAssembly. Resembling ECMAScript and JavaScript, but with static types, the language is developed by the AssemblyScript Project with contributions from the AssemblyScript community.

peacenotwar is a piece of malware, which has been characterized as protestware, created by Brandon Nozaki Miller. In March 2022, it was added as a dependency in an update for node-ipc, a common JavaScript dependency.

References

  1. ↑ "Release Date of Version 1.0.0" . Retrieved 2020-12-31.
  2. ↑ "Release 5.93.0". 11 July 2024. Retrieved 28 July 2024.
  3. ↑ "LICENSE file on GitHub" . Retrieved 2020-12-31.
  4. ↑ "License field from webpack - npm" . Retrieved 2020-12-31.
  5. ↑ "Web Performance Optimization with webpack". Google Inc. Retrieved 16 Oct 2018.
  6. ↑ "A Beginner's Guide to webpack 4 and Module Bundling". SitePoint . Retrieved 16 Oct 2018.
  7. ↑ "Webpack 4.0 Release Brings Simplified Configuration, WebAssembly Support, and Big Performance Boost". InfoQ. Retrieved 16 Oct 2018.
  8. ↑ "High-performance webpack config for front-end delivery". Codementor . Retrieved 16 Oct 2018.
  9. ↑ "What is webpack". SurviveJS. Retrieved 16 Oct 2018.
  10. ↑ "What is webpack". GitHub. Retrieved 25 Feb 2018.
  11. ↑ "Dynamic imports". webpack. Retrieved 6 Jun 2022.
This page is based on this Wikipedia article
Text is available under the CC BY-SA 4.0 license; additional terms may apply.
Images, videos and audio are available under their respective licenses.