Bundler

This is a minimal JavaScript bundler. It bundles, tree-shakes and minifies JavaScript modules out of the box.

Features

Scope Hoisting: Combines modules into a single scope to minimize runtime overhead.
Tree-Shaking: Automatically removes dead code to output the smallest bundle possible.
Minification: Compresses the final bundle even further by removing unnecessary characters.
Minimalist Core: A small, focused codebase that’s easier to understand.

Usage

You can use Bundler to bundle your JavaScript projects from the command line.

npx @omkarj13/bundler bundle --entry ./src/index.js --output ./dist/bundle.js

Options

Option	Description	Default
`--entry`	The entry point of your application.	(required)
`--output`	The path to write the bundled file to.	(required)
`--treeshake`	Enable or disable tree-shaking.	`true`
`--minify`	Minify the output bundle.	`true`
`--config`	Path to a configuration file.	`bundler.config.js`

Configuration File

You can also configure Bundler using a bundler.config.js file:

export default {
  entry: './src/index.js',
  output: './dist/bundle.js',
  minify: true,
  treeshake: true,
};

How It Works

This bundler processes JavaScript modules in the following sequence:

Parsing & Dependency Graph Construction: It starts from the entry file, parsing the code into an Abstract Syntax Tree (AST). It then traverses the import statements to discover all dependencies, building a complete graph of your project’s modules.
Tree Shaking: The dependency graph is analyzed to identify and remove any code that is not actually used in the project, which helps to reduce the final bundle size.
Deconflicting Identifiers: To prevent naming collisions when all the modules are combined, the bundler intelligently renames variables as needed.
Scope Hoisting: The import and export statements, which are specific to modules, are transformed and rewritten so that all the code can exist within a single scope.
Code Generation: Finally, the transformed code from all modules is concatenated, minified, and a single bundled JavaScript file is generated.

Development

To get started with development:

Clone the repository:

git clone https://github.com/OmkarJ13/bundler.git

Install dependencies:
Terminal window
```
npm install
```
Run the tests:
Terminal window
```
npm test
```

Future Scope & Contributions

There are many opportunities to expand the capabilities of this project, and contributions are welcome! Some of the features that could be added in the future include:

Source Maps: To make debugging bundled code easier.
Code Splitting: To split the bundle into smaller chunks that can be loaded on demand.
Plugin System: To allow for custom transformations and optimizations.

If you’re interested in contributing, feel free to open an issue or submit a pull request.

← Back to projects

Info